我编写了一个基本函数,允许我从地图外的链接显示弹出窗口.打开弹出窗口的功能工作正常,但我无法关闭它.
演示链接:http://www.catchingtherain.com/bikestats/stations.php – 单击左侧选项卡式面板中的链接.
这里有更多细节……
典型的地图在从kml加载的矢量图层“站”上具有大约300个特征.这些是使用激活onload
select = new OpenLayers.Control.SelectFeature(stations);
stations.events.on({
"featureselected": onFeatureSelect,
"featureunselected": onFeatureUnselect
});
map.addLayer(stations);
map.addControl(select);
select.activate();
哪个工作正常 – 我可以打开和关闭弹出窗口.
使用我的off-map链接,我调用onclick =“showMyPopup([x]),[x]是从kml加载的ID属性.showMyPopup函数是
function showMyPopup(myID){
for(var a = 0; a < stations.features.length; a++){ //loop through all the features
var feature = stations.features[a];
if (feature.attributes.ID.value == myID) { //until it finds the one with the matching ID attribute
var content = "<h4>" + feature.attributes.name + "</h4>" + feature.attributes.description;
popup = new OpenLayers.Popup.FramedCloud("chicken",
feature.geometry.getBounds().getCenterLonLat(),
new OpenLayers.Size(200,200),
content,
null, true, onPopupClose);
feature.popup = popup;
map.addPopup(popup);
}
}
}
这将按照预期从工作站层打开正确的弹出窗口,我可以在工作站图层上使用DOM检查器看到弹出窗口,就像通过单击地图功能加载一样,但是那时似乎无法关闭它.站点层的原始功能虽然正常(打开和关闭).
任何帮助将不胜感激(也许有一种更简单的方法解决这个问题?)
谢谢,詹姆斯
PS,以防万一,这是onFeatureUnselect函数…
function onFeatureUnselect(event) {
var feature = event.feature;
if(feature.popup) {
map.removePopup(feature.popup);
feature.popup.destroy();
delete feature.popup;
}
}
解决方法:
你的onPopupClose()函数是:
function onPopupClose(evt) {
select.unselectAll();
}
当您从地图中选择要素并单击弹出窗口的关闭图标时,将取消选择要素,但弹出窗口尚未关闭.然后,触发onFeatureUnselect事件,并实际关闭弹出窗口.
当您通过showMyPopup()函数创建弹出窗口时,您没有选择它.调用onPopupClose(),但它不会关闭弹出窗口.未触发onFeatureUnselect.
我建议在showMyPopup()函数中选择功能. featureselected事件将被触发并且onFeatureSelect()创建弹出窗口,用户可以使用弹出窗口的关闭图标和取消选择地图上的功能来关闭弹出窗口.
但是,当您使用代码选择功能并尝试通过clickout取消选择时,OL中可能存在错误(或意外行为).它在这里描述:http://lists.osgeo.org/pipermail/openlayers-users/2012-September/026349.html一种可能的解决方法是手动设置SelectControl.handlers.feature.lastFeature.
function showMyPopup(myID){
for(var a = 0; a < stations.features.length; a++){ //loop through all the features
var feature = stations.features[a];
if (feature.attributes.ID.value == myID) { //until it finds the one with the matching ID attribute
// select is your SelectFeature control
select.select(feature);
// Fix for unselect bug
select.handlers.feature.lastFeature = feature;
break;
}
}
}