ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

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

2019-07-04 02:30:00  阅读:376  来源: 互联网

标签:javascript popup openlayers


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

演示链接: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;
        }
    }
}

标签:javascript,popup,openlayers
来源: https://codeday.me/bug/20190704/1372935.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有