我正在使用OpenLayers查看地图,我遇到了标记弹出窗口的问题。当加载标记时,我将为它们分配moouseover和mouseout两个事件,但是当使用这些事件触发任何标记时,仅显示第一个创建的标记的弹出窗口,即使我将鼠标悬停在其他标记上也是如此。就像我只是为第一个标记创建这些事件而不是所有这些事件。任何想法?感谢
var listMarkers = getMarkers();
for (var i = 0; i < listMarkers.length; i++) {
var size = new OpenLayers.Size(21, 25);
var offset = new OpenLayers.Pixel(-(size.w / 2), -size.h);
var icon;
if (listMarkers[i].Icon.trim() === "red") {
icon = new OpenLayers.Icon
('http://www.openlayers.org/dev/img/marker.png', size, offset);
}
else {
icon = new OpenLayers.Icon
('http://www.openlayers.org/dev/img/marker-' + listMarkers[i].Icon.trim() + '.png', size, offset);
}
var mark = new OpenLayers.Marker(new OpenLayers.LonLat(listMarkers[i].Longitude,
listMarkers[i].Latitude).transform(new OpenLayers.Projection("EPSG:4326"),
map.getProjectionObject()), icon);
//here add mouseover event
mark.events.register('mouseover', mark, function (evt) {
popup = new OpenLayers.Popup.FramedCloud("Popup",
new OpenLayers.LonLat(listMarkers[i].Longitude,
listMarkers[i].Latitude).transform(new OpenLayers.Projection("EPSG:4326"),
map.getProjectionObject()),
null,
'<div><b>' + listMarkers[i].Title + '</b><br/>' + listMarkers[i].Description + '</div>',
null,
false);
map.addPopup(popup);
});
//here add mouseout event
mark.events.register('mouseout', mark, function (evt) { popup.hide(); });
markers.addMarker(mark);
}
答案 0 :(得分:0)
在创建弹出窗口时mouseover
事件中,您指的是listMarkers[i]
,它在javascript范围内会记住给定变量i的最后一个值,因此对于每个弹出窗口,它都会从{{1}获取信息}}。要解决此问题,请将详细信息(标题,纬度,经度)添加到标记对象(listMarkers[listMarkers.length-1]
)中,然后在mark.data.Title = listMarkers[i]
或evt
对象的事件处理程序中读取它们(因为您是在this
通话中设置它。