Помогите добавить infowindow в код google maps.
<!DOCTYPE>
<html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <style type="text/css"> #map-container { padding: 6px; border-width: 1px; border-style: solid; border-color: #ccc #ccc #999 #ccc; -webkit-box-shadow: rgba(64, 64, 64, 0.5) 0 2px 5px; -moz-box-shadow: rgba(64, 64, 64, 0.5) 0 2px 5px; box-shadow: rgba(64, 64, 64, 0.1) 0 2px 5px; width: 100%; } #map { width: 100%; height: 897px; } </style> <script src="http://maps.google.com/maps/api/js?sensor=false"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/src/markerclusterer.js"></script> <script type="text/javascript"> function initialize() { var center = new google.maps.LatLng(46.6638584,32.1097876); var map = new google.maps.Map(document.getElementById('map'), { zoom: 5, center: center, mapTypeId: google.maps.MapTypeId.ROADMAP }); var markers = []; $.ajax({ type: "GET", url: "vivmarkers_xml.php", dataType: "xml", success: function(xml) { $(xml).find("marker").each(function(){ var lat = $(this).attr('lon'); var lng = $(this).attr('lat'); var latLng = new google.maps.LatLng(parseFloat(lat), parseFloat(lng)); var marker = new google.maps.Marker({ position: new google.maps.LatLng(lat, lng), map: map, title: '', icon: 'marker.png' }); markers.push(marker); }); var markerCluster = new MarkerClusterer(map, markers); } }); } google.maps.event.addDomListener(window, 'load', initialize); </script> </head> <body> <div id="map-container"><div id="map"></div></div> </body> </html> |
Нашел итвент на свой вопрос
<!DOCTYPE>
<html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <style type="text/css"> #map-container { padding: 6px; border-width: 1px; border-style: solid; border-color: #ccc #ccc #999 #ccc; -webkit-box-shadow: rgba(64, 64, 64, 0.5) 0 2px 5px; -moz-box-shadow: rgba(64, 64, 64, 0.5) 0 2px 5px; box-shadow: rgba(64, 64, 64, 0.1) 0 2px 5px; width: 100%; } #map { width: 100%; height: 897px; } </style> <script src="http://maps.google.com/maps/api/js?sensor=false"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/src/markerclusterer.js"></script> <script type="text/javascript"> function initialize() { var center = new google.maps.LatLng(46.6638584,32.1097876); var map = new google.maps.Map(document.getElementById('map'), { zoom: 5, center: center, mapTypeId: google.maps.MapTypeId.ROADMAP }); var markers = []; $.ajax({ type: "GET", url: "vivmarkers_xml.php", dataType: "xml", success: function(xml) { $(xml).find("marker").each(function(){ var name = $(this).attr("name"); var address = $(this).attr("address"); var lat = $(this).attr('lon'); var lng = $(this).attr('lat'); var latLng = new google.maps.LatLng(parseFloat(lat), parseFloat(lng)); var type = $(this).attr('type'); var contentString = "<div>" + type + "<td>" + name + "</td>" + "<div><td>" + address + "</td></div>" + "</div>" var infowindow = new google.maps.InfoWindow({ content: contentString }); var marker = new google.maps.Marker({ position: new google.maps.LatLng(lat, lng), map: map, title: '', icon: 'marker.png' }); google.maps.event.addListener(marker, 'click', function() { infowindow.open(map,marker); }); markers.push(marker); }); var markerCluster = new MarkerClusterer(map, markers); } }); } google.maps.event.addDomListener(window, 'load', initialize); </script> </head> <body> <div id="map-container"><div id="map"></div></div> </body> </html> |
Часовой пояс GMT +3, время: 05:44. |