無法在Google地圖中標記多個座標

下面列出了用於在Google地圖中設置標記的代碼。但只設置了一個標記，而應設置四個標記。無法在Google地圖中標記多個座標

這段代碼有什麼問題？

<!DOCTYPE html> 
<html> 
<head> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<style type="text/css"> 
    html { height: 100% } 
    body { height: 100%; margin: 0px; padding: 0px } 
    #map_canvas { height: 100% } 
</style> 
<script type="text/javascript" 
    src="http://maps.google.com/maps/api/js?sensor=false"> 
</script> 
<script type="text/javascript"> 
var locations = [ 
[4, -33.890542, 151.274856,'Town1', 'Page1.aspx'], 
[3, -33.923036, 151.259052,'Town2', 'Page1.aspx'], 
[2, -34.028249, 151.157507,'Town3', 'Page1.aspx'], 
[1, -33.80010128657071, 151.28747820854187,'Town4', 'Page1.aspx'] 
]; 
</script> 

<script type="text/javascript"> 
    function initialize() { 
      var myOptions = { 
       zoom: 10, 
       center: new google.maps.LatLng(-33.9, 151.2), 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
      var map = new google.maps.Map(document.getElementById("map_canvas"), 
           myOptions); 

      setMarkers(map, locations); 
     } 

     /** 
     * Data for the markers consisting of a name, a LatLng and a zIndex for 
     * the order in which these markers should display on top of each 
     * other. 
     */ 


     function setMarkers(map, locations) { 
      debugger; 
      for (var i = 0; i < locations.length; i++) { 
       var location = locations[i]; 
       if (location != undefined) { 
        var myLatLng = new google.maps.LatLng(location[1], location[2]); 
        var marker = new google.maps.Marker({ 
         position: myLatLng, 
         map: map, 
         title: location[3], 
         zIndex: location[0] 
        }); 
       } 

       var latlngbounds = new google.maps.LatLngBounds(); 
       for (var i = 0; i < locations.length; i++) { 
        var location = locations[i]; 
        if (location != undefined) { 
         var point = new google.maps.LatLng(location[1], location[2]); 
         latlngbounds.extend(point); 
        } 
       } 
       map.setCenter(latlngbounds.getCenter()); 
      } 
     } 


</script> 
</head> 
<body onload="initialize()"> 
    <div id="map_canvas" style="width:100%; height:100%"></div> 
</body> 
</html>

來源

2010-10-14 TrustyCoder

看看這個，它的工作原理奇妙的我： http://stackoverflow.com/questions/3059044/google-maps-js-api-v3-simple-multiple-marker-example – Alsaket 2011-07-30 16:59:14

我能夠通過改變點的標記方式來標記多個點。顯然，在添加到地圖之前，點應標記。但是我無法設置多個信息窗口。無論點擊哪個標記，只顯示一個信息窗口。所述udpated代碼給出如下─

功能setMarkers（地圖，位置）{ 爲（VAR I = 0;我< locations.length;我++）{ VAR位置=位置[I]; （位置！=未定義）{ var latlngbounds = new google.maps.LatLngBounds（）; var point = new google.maps.LatLng（location [1]，location [2]）;

   latlngbounds.extend(point); 

       var myLatLng = new google.maps.LatLng(location[1], location[2]); 
       var marker = new google.maps.Marker({ 
        position: myLatLng, 
        map: map, 
        title: location[3], 
        zIndex: location[0] 
       }); 
       var content = "<a href='" + location[4] + "'><strong>" + location[3] + "</strong></a>"; 
       var infowindow = new google.maps.InfoWindow({ 
        content: content 
       }); 

       var marker = new google.maps.Marker({ 
        position: myLatLng, 
        map: map, 
        title: location[3] 
       }); 
       google.maps.event.addListener(marker, 'click', function() { 
        infowindow.open(map, marker); 
       }); 
      } 

      map.setCenter(latlngbounds.getCenter()); 
     } 
    }

來源

2010-10-14 21:32:27 TrustyCoder

無法在Google地圖中標記多個座標

回答

相關問題