javascript - 通过单击 Google map 上的标记来打开 div 而不是 infowindow

Question

我有一个全屏 Google map ，底部有一个小 div，用于保存打开和关闭标记的图像。我还有一个隐藏的 div，用于保存每个标记的信息(通常出现在信息窗口中)。

我希望能够在 map 上单击标记时 show() 或 fadein() 隐藏的 div。这就是我添加标记的方式。

for (i = 0; i < locations.length; i++) {
var myLatLng = new google.maps.LatLng(locations[i][1], locations[i][2]);
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][2], locations[i][2]),
icon: icons[locations[i][4]].icon,
map: map,
id: locations[i][3],
type: locations[i][4]
});
markerGroups[locations[i][4]].push(marker);
google.maps.event.addListener(marker, 'click', (function(marker, i) {
toggleWindow(marker.id);
})(marker, i));
bounds.extend(myLatLng);
}
if (locations.length > 0){
map.fitBounds(bounds);
}

数组中的每个位置如下所示: ["1.50 英寸", 37.5, -77.33, 0, "冰雹150"]

切换窗口函数是:

function toggleWindow(id){
var godiv = '#sr'+id;
if ($(godiv).css('display') == 'block') {
$(godiv).css('display', 'none');
}
else {
$("#reportframe").children().hide(); 
$(godiv).css('display', 'block');
};
};

当您单击标记时，我收到错误:

未捕获类型错误:无法读取未定义的属性“apply”(main.js:17)

我尝试了几种不同的方法，但似乎 ID 不匹配或 GMaps 无法访问该变量。

Fiddle

Answer 1

用作点击处理程序的函数调用必须返回一个函数(返回的函数将是处理程序)。目前该函数不会返回任何内容，“无”是错误消息中的 undefined。

所以它必须是例如:

google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function(){toggleWindow(marker.id);}
})(marker, i));

SEE DEMO