谷歌地图API添加infowindow到单击事件上的标记数组

Question

我试图做一个标记数组，并让每个标记打开一个信息窗口与相关信息onclick但我得到一个无法读取'应用'属性的undefined或者打开错误的标记;我的2个企图是：

无法读取应用：

var infowindow = new google.maps.Infowindow(); 
for (var i=0;i<popular.length;i++){ 
    var mkrLatLng = new google.maps.LatLng(popular[i][1], popular[i][2]); 
    var marker = new google.maps.Marker({ 
     map: map, 
     title: popular[i][0], 
     position: mkrLatLng 
    }); 
    markers.push(marker); 
} 

for (var i=0;i<markers.length;i++){ 
    markers[i].addListener('click', (function(){ 
    console.log('click'); 
    cont = "<div> " + markers[i].title + " </div>"; 
    infowindow.setContent(cont); 
    infowindow.open(map, marker); 
    })(markers)); 
} 

打开上错误标记（匿名函数包装在另一个函数，因为它摆脱了未定义错误的，我不明白为什么）：

var infowindow = new google.maps.Infowindow(); 
for (var i=0;i<popular.length;i++){ 
    var mkrLatLng = new google.maps.LatLng(popular[i][1], popular[i][2]); 
    var marker = new google.maps.Marker({ 
     map: map, 
     title: popular[i][0], 
     position: mkrLatLng 
    }); 
    marker.addListener('click', function(){(function(){ 
     console.log('click'); 
     cont = "<div> " + marker.title + " </div>"; 
     infowindow.setContent(cont); 
     infowindow.open(map, marker); 
    })(marker)}); 
    markers.push(marker); 
} 

Answer 1

你的结构是错误的

这是示例enter link description here

//wrong 
for(var i=0;i<3;i++){ 
    var count=i 
    $('<p>wrong</p>').on('click',function(){ 
     alert(count) 
    }).appendTo('body') 
} 
//what you want 
for(var i=0;i<3;i++){ 
    createEl(i) 
} 
function createEl(i){ 
$('<p>correct</p>').on('click',function(){ 
     alert(i) 
    }).appendTo('body') 
} 

希望这将帮助你理解为什么你错了

所以，你需要更改您的代码此

for(){ 
    createMarker(parameter) 
} 
function createMarker(parameter){ 
    var marker=..., 
     infowindow=.... 
    marker.addlistener(...) 
    ....... 
} 

Answer 2

试试你的第二个代码，使VAR信息窗口全球，也许它会工作，我不知道。

否则，你可以在forloop中新建每个infowindow，并推入数组，就像处理标记一样。

var mark = new google.maps.Marker({ 
     map: map, 
     position: place.geometry.location, 
     optimized: false, 
     icon: 'red-dot.png' 
    }), 
    infowindow = new google.maps.InfoWindow() 
infowindow.setContent(place.name) 
infowindows.push(infowindow) 
//then addlistener to marker 
//markers.push(marker) 

打开刚才一个信息窗口，使用infowindow.close（）关闭所有信息窗口，

然后调用infowindow.open（地图，标记）