Question

我正在使用OpenLayers创建地图和绘图位置。每个位置都有一个标记和一个弹出窗口，并使用OpenLayers.Feature创建 - 目前，我肯定在我的舒适区之外，所以我将示例代码拼凑在一起。

标记创建如下（我为了简洁起见了我希望明显的变量赋值）：

function addMarker(ll, popupClass, popupContentHTML, closeBox, overflow, type)
{
    var feature = new OpenLayers.Feature(markerLayer, ll);  
    feature.closeBox = closeBox;
    feature.popupClass = popupClass;
    feature.data.icon = icon;
    feature.data.popupContentHTML = popupContentHTML;
    feature.data.overflow = (overflow) ? "auto" : "hidden";

    var marker = feature.createMarker();
    var markerClick = function (evt) {
        if (this.popup == null) {
            this.popup = this.createPopup(this.closeBox);
            map.addPopup(this.popup);
            this.popup.show();
        } else {
            this.popup.toggle();
    }
        currentPopup = this.popup;
        OpenLayers.Event.stop(evt);
    };

    marker.events.register("mousedown", feature, markerClick);
    markerLayer.addMarker(marker);
}

地图可以包含许多标记。

单击标记时，弹出窗口会打开和关闭。我想要的是，当点击一个新标记并弹出一个弹出窗口时，将关闭地图上所有标记的所有弹出窗口关闭 - 也就是说，我只想一次显示一个弹出窗口。

可能我的方法完全错了，但是会感激指针，甚至只是尝试的想法。

Answer 1

如果你实现了一个解决方案，而一次只有一个弹出窗口处于活动状态（即每次取消选中弹出窗口时它都会消失），你一次不会有多个弹出窗口。

阅读我为这个问题写的this STACKOVERFLOW答案。你有所有必要的伪代码（对所有内容都有冗长的解释）。

如果您不需要解释，则显示解决方案：

var urlKML = 'parseKMLTrack07d.php';         
var layerKML = new OpenLayers.Layer.Vector("KML1", {
            strategies: [new OpenLayers.Strategy.Fixed()],
            protocol: new OpenLayers.Protocol.HTTP({
                url: urlKML,
                format: new OpenLayers.Format.KML({
                    extractStyles: true, 
                    extractAttributes: true,
                    maxDepth: 2
                })
            })
        });

var layerOSM = new OpenLayers.Layer.OSM();
var map = new OpenLayers.Map({
    div: "map",
    layers: [
        layerOSM,
        layerKML 
    ]
});

var selectStop = new OpenLayers.Control.SelectFeature(layerKML,{onSelect: onFeatureSelect, onUnselect: onFeatureUnselect});
layerKML.events.on({
            "featureselected": onFeatureSelect,
            "featureunselected": onFeatureUnselect
        });
map.addControl(selectStop);
selectStop.activate();

function onFeatureSelect(event) {
    var feature = event.feature;
    var content = feature.attributes.name + '<br/>'+feature.attributes.description;
    popup = new OpenLayers.Popup.FramedCloud("chicken", 
                             feature.geometry.getBounds().getCenterLonLat(),
                             new OpenLayers.Size(100,100),
                             content,
                             null, true, onFeatureUnselect);
    feature.popup = popup;
    map.addPopup(popup);
    // GLOBAL variable, in case popup is destroyed by clicking CLOSE box
    lastfeature = feature;
}
function onFeatureUnselect(event) {
    var feature = lastfeature;  
    if(feature.popup) {
        map.removePopup(feature.popup);
        feature.popup.destroy();
        delete feature.popup;
    }
}

现在，如果你真的想要销毁所有弹出窗口，无论如何（我非常劝阻）：

function popupClear() {
    //alert('number of popups '+map.popups.length);
    while( map.popups.length ) {
         map.removePopup(map.popups[0]);
    }
}

Answer 2

我对OpenLayers的记忆是你应该为功能选择实现一个控件。

我希望它能与你的标记一起使用......

var selectedFeature, selectControl;
function init() {
...
  selectControl = new OpenLayers.Control.SelectFeature(yourMainLayer, {
        onSelect: onFeatureSelect, // will be called on feature select
        onUnselect: onFeatureUnselect // will be called on feature unselect
  });
  selectControl.activate();
...
}

function onFeatureSelect(feature) {
            popup = new OpenLayers.Popup.FramedCloud("chicken", 
                                     feature.geometry.getBounds().getCenterLonLat(),
                                     null,
                                     "some informations",
                                     null, true, onPopupClose);
            feature.popup = popup;
            map.addPopup(popup);
}
function onFeatureUnselect(feature) {
   map.removePopup(feature.popup);
   feature.popup.destroy();
   feature.popup = null;
} 
function onPopupClose(evt) {
   selectControl.unselect(selectedFeature);
}

Answer 3

为什么不将打开的弹出窗口放到if(this.popup == null)分支上的数组中，以及在此数组上的else分支循环上，并隐藏所有弹出窗口。

从OpenLayers功能中删除所有弹出窗口

3 个答案: