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

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分支遍历这个数组并隐藏所有弹出窗口。