從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分支遍歷這個數組並隱藏所有彈出窗口。