4

我编写了一个基本函数,允许我从地图外的链接显示弹出窗口。打开弹出窗口的功能工作正常,但我无法关闭它。

演示链接: http: //www.catchtherain.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();

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

使用我的地图外链接,我正在调用 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;
        }
     }
4

2 回答 2

2

你的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;
        }
    }
}
于 2012-11-21T08:26:53.617 回答
0

我看了一下 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 函数,则需要在代码中调用 hide 函数。

于 2012-11-20T21:22:02.043 回答