Google Maps API v3 For循环问题

Question

也许我在尝试做的事情上完全偏离了轨道，但是我很想回到第2版，因为我可以轻松进行此工作（但我希望对移动设备友好）。

我试图生成一些标记，并保存代码，将标记生成放入for循环中，该循环遍历标记数组（有实际值而不是（long，lat，x，x， x）在实数数组中）。

有什么东西完全在我头上吗？

 function initialize() {
    var latlng = new google.maps.LatLng(25, 15);
    var myOptions = {
      zoom: 2,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);


var myMarker = new Array();
myMarker[0] = new Array(long,lat,x,x,x); 
myMarker[0] = new Array(long,lat,x,x,x); 
myMarker[0] = new Array(long,lat,x,x,x); 
myMarker[0] = new Array(long,lat,x,x,x); 
myMarker[0] = new Array(long,lat,x,x,x); 
myMarker[0] = new Array(long,lat,x,x,x); 
myMarker[0] = new Array(long,lat,x,x,x); 

for(var i = 0; i < myMarker.length; i++) {
    var marker = new google.maps.Marker({
        position: new google.maps.LatLng(myMarker[i](1), myMarker[i](2)), 
        map: map, 
        title: myMarker[i](5)
      });
    var infowindow = new google.maps.InfoWindow({content: myMarker[i](5)}); 
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.open(map,marker);
    });
}

}

当我单独制作标记时，此代码有效。

Answer 1

问题在于所有这些侦听器函数都共享相同的“映射”和“标记”值。 您需要将它们包装在另一个函数中：

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

在整个循环的每次迭代中，“ map”和“ marker”变量都会更改。 那些监听器函数没有它们的副本，除非您像我在该示例中那样显式设置一些设置来做到这一点。 因此，所有的听众最终都会处理循环所碰到的最后一件事！

编辑 -实际上，既然我再次阅读了代码，“地图”看起来就没有改变，因此它可能会从我的设置中删除（尽管没有任何伤害）。

Answer 2

我注意到的几件事是数组定义和访问它们。 例如

// here your defining the array, quick tip just use [] instead of new Array(); its faster, in both execution and to type :)
var myMarker = new Array(); 

//here your defining the 1st value in the array at the 0 index
myMarker[0] = new Array(long,lat,x,x,x); 

//but again here your overriding the first value of the array at 0 index
myMarker[0] = new Array(long,lat,x,x,x); 

所以应该看起来像这样

var myMarker = new Array();
myMarker[0] = new Array(long,lat,x,x,x); 
myMarker[1] = new Array(long,lat,x,x,x); 
myMarker[2] = new Array(long,lat,x,x,x); 
myMarker[3] = new Array(long,lat,x,x,x); 
myMarker[4] = new Array(long,lat,x,x,x); 
myMarker[5] = new Array(long,lat,x,x,x); 
myMarker[6] = new Array(long,lat,x,x,x); 

然后当您访问数组中的值时

title: myMarker[i](5)

您应该假设每个标记数组中有5个值

title: myMarker[i][4]

javascript中的数组是基于0的索引，并使用方括号[]而不是括号。

编辑：语法修复:)

Answer 3

问题是只有一个marker值，并且每次循环迭代都会更改它。 事件处理程序功能无法跟踪所需的标记。

解决此问题的正确方法是知道将marker作为this传递到事件处理程序中。 简单的解决方法是：

google.maps.event.addListener(marker, 'click', function() {
  infowindow.open(map, this);  // <-- changed 'marker' to 'this'
});