我已经看到了与此相关的其他问题,我看到的解决方案似乎都没有帮助。也许我只是在忽视某些事情。
任何帮助都将不胜感激。
我有一张地图,我加载了超过1000个标记。当用户在标记上执行鼠标悬停时,我需要显示标记所在标记的信息窗口。
我遇到的问题是,无论我将鼠标悬停在哪个标记上,相同的信息都出现在同一个标记上。
我在下面提供了一个屏幕截图,其中显示了带有标记和infowindow的地图。所以,无论我鼠标移动哪个标记,都会显示相同的信息。
这是代码(gm是一个实例化的google.maps对象):
for (var i = 0; i < opts.LocationsData.length; i ++) {
var datum = opts.LocationsData[i];
var icon = new gm.MarkerImage(datum.map_pin_loc + datum.map_marker + '.svg',null, null, null, new google.maps.Size(31,51));
var loc = new gm.LatLng(datum.latitude, datum.longitude);
var zi = 500;
if(i>9)
{
datum.map_pin_icon = datum.map_pin_loc + 'dot1.svg';
icon = new gm.MarkerImage(datum.map_pin_icon,null, null, null, new google.maps.Size(8,8));
zi=450;
}
var marker = new gm.Marker({
position: loc,
/** title: datum.title != '' ? datum.title : datum.description, **/
icon: icon,
zIndex: zi,
map: map
});
marker.type = 'point';
marker.post_id = datum.pin_id;
marker.scrollAndAnimate = true;
/** (these are used elsewhere in my code for marker management and other purposes) **/
markers.push(marker);
markersLatLngObjs.push(loc);
var infowindow = new gm.InfoWindow({
content: '<strong>' + (datum.title != '' ? datum.title : datum.description) + '</strong>'
});
gm.event.addListener(marker, 'mouseover', function() {
infowindow.open(map,marker);
});
}
答案 0 :(得分:1)
pb是mouseover事件处理程序是一个闭包引用变量,它们在调用函数的上下文中是唯一的。最好将这部分移到循环外部以便看清楚。
例如,您可以定义一个函数,例如:
function showInfo() {
// called in the context of a marker
var datum = opts.LocationsData[this.placeIndex];
var infowindow = new gm.InfoWindow({
content: '<strong>' + (datum.title != '' ? datum.title : datum.description) + '</strong>'
});
infowindow.open(map, this);
}
在循环之前,然后在循环中使用属性placeIndex
(例如)标记标记:
marker.placeIndex = i;
最后使用:
绑定处理程序 gm.event.addListener(marker, 'mouseover', showInfo);
编辑:哎呀,我的坏,忘记了其他的引用,同样的pb。您可以在处理程序中用'this'替换标记。我更新了代码。