OpenLayers:当使用来自外部地图的调用添加时，无法关闭弹出窗口

Question

我已经编写了一个基本函数，允许我显示地图外链接的弹出窗口。打开弹出窗口的功能运行良好，但我无法关闭它。

演示链接：http://www.catchingtherain.com/bikestats/stations.php-单击左侧选项卡面板中的链接。

这里有更多的细节。。。

一张典型的地图在从kml加载的矢量层"站"上有大约300个特征。这些是使用加载激活的

select = new OpenLayers.Control.SelectFeature(stations);           
stations.events.on({
"featureselected": onFeatureSelect,
"featureunselected": onFeatureUnselect
});
map.addLayer(stations);
map.addControl(select);
select.activate();

这很好用-我可以打开和关闭弹出窗口。

使用我的地图外链接，我调用onclick="showMyPopup([x])，[x]是从kml加载的ID属性

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检查器看到弹出窗口，就像点击地图功能加载时一样，但似乎没有办法关闭它。站点层的原始功能运行良好(打开和关闭)。

任何帮助都将不胜感激(也许有一种更简单的方法来解决这个问题？)

谢谢，James

PS和以防万一，这里有onFeatureUnselect函数。。。

function onFeatureUnselect(event) {
var feature = event.feature;
if(feature.popup) {
map.removePopup(feature.popup);
feature.popup.destroy();
delete feature.popup;
}
}

Answer 1

您在onPopupClose()上的函数是：

function onPopupClose(evt) {
select.unselectAll();
}

当您从地图中选择功能并点击弹出窗口的关闭图标时，功能将被取消选择，但弹出窗口尚未关闭。然后，onFeatureUnselect事件被触发，弹出窗口实际上被关闭。

当你用showMyPopup()函数创建弹出窗口时，你没有选择它。onPopupClose()被调用，但它不会关闭弹出窗口。onFeatureUnselect不被触发。

我建议在showMyPopup()函数中选择特性。featureselected事件将被触发，弹出窗口由onFeatureSelect()创建，用户可以通过弹出窗口的关闭图标和地图上的取消选择功能关闭弹出窗口。

但遗憾的是，当您用代码选择功能并尝试用点击取消选择时，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;
}
}
}

Answer 2

我查看了OpenLayers的源代码，在Popup.js中有这样的东西。。。

...
var closePopup = callback || function(e) {
this.hide();
OpenLayers.Event.stop(e);
};
OpenLayers.Event.observe(this.closeDiv, "touchend", 
OpenLayers.Function.bindAsEventListener(closePopup, this));
OpenLayers.Event.observe(this.closeDiv, "click", 
OpenLayers.Function.bindAsEventListener(closePopup, this));
...

在我看来，如果你添加自己的closePopup函数，你需要在代码中调用隐藏函数。