2013-08-02 215 views
0

我试图把我的网页上的谷歌地图与多个标记(> 1000),每个人都有自己的独特的信息窗口。我通过数组添加标记,标记看起来很好,但所有信息窗口都有相同的确切内容。我很茫然,非常感谢你的信息。这里是我的代码:谷歌地图多个标记与多个信息窗口

<script> 
var map; 
var markersArray = []; 
var infowindow = new google.maps.InfoWindow({ 
    content: '' 
}); 

function initialize() { 

    bounds = new google.maps.LatLngBounds(); 

    usa = new google.maps.LatLng(37.09024, -95.712891); 

    var myOptions = { 
     zoom: 4, 
     center: usa, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     navigationControlOptions: { 
      style: google.maps.NavigationControlStyle.SMALL 
     } 
    }; 

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

    plotMarkers(); 
} 

// here is where the array content is contained 
var webApps = [<%=strArray%>]; 

function plotMarkers(){ 
    var i; 
    for(i = 0; i < webApps.length; i++){ 
     codeAddresses(webApps[i]); 
    } 
} 

function codeAddresses(address){ 

    // other variables 
    lat = address[3]; 
    lng = address[4]; 
    desc = address[0] 

    myLatlng = new google.maps.LatLng(lat,lng); 

    var marker = new google.maps.Marker({ 
     position: myLatlng, 
     map: map, 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
     infowindow.setContent(desc); 
     infowindow.open(map, this); 
    }); 

} 

google.maps.event.addDomListener(window, 'load', initialize); 
</script> 
<div id="map_canvas" style="width: 100%; height: 600px;"></div> 
+0

[Google Maps JS API v3 - 简单多标记示例]的可能重复(http://stackoverflow.com/questions/3059044/google-maps-js-api-v3-simple-multiple-marker-example) – geocodezip

回答

2

看起来像desc是一个全局变量。因此,在循环的每次迭代中,您将其设置为其他值,这意味着它将始终等于您所迭代的最后一项的描述。

试着把var放在它的前面,使它成为一个局部变量。例如:var desc = address[0];

当你这样做时,一个名为“closure”的概念将确保你创建的每个监听器在创建时都会引用desc的值,而不是它最后设置的值。

这是避免使用全局变量的一个最佳实践,原因有几个,这就是其中之一。你应该养成用var加前缀变量的习惯。

信息的变量范围:

http://msdn.microsoft.com/en-us/library/ie/bzt2dkta(v=vs.94).aspx

信息上封闭:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Closures

+0

+1,正在写相同的答案。更多关于SO的信息:http://stackoverflow.com/questions/111102/how-do-javascript-closures-work/ – Mics

+0

另外,你可以考虑设置'desc'作为标记的属性以避免使用闭包。 – Mics

+0

哇!这太疯狂了!我从来没有想过这一个。多谢你们!!!!! – Damien

相关问题