OpenLayers.Popup closeBoxCallback未解僱

Question

這是我在stackoverflow上的第一個問題，而英語不是我的母語，所以我想爲錯誤辯解。

我有一個標記OpenLayers地圖。每一個標記都有它自己的彈出窗口，當點擊它時顯示。如果點擊標記，它應該消失，只有彈出窗口應該可見。當彈出窗口關閉時，標記應該再次出現。

var map = new OpenLayers.Map({ 
    div: 'map' 
}); 
var markers = new OpenLayers.Layer.Markers('Markers'); 
map.addLayers([new OpenLayers.Layer.Google('Google Streets'), markers]); 

var closeCallback = function() { 
    console.log("CLOSE!!!"); 
    this.marker.display(true); 
    this.hide(); 
}; 
var clickCallback = function(event) { 
    for (var i = 0; i < map.popups.length; i = i + 1) { 
     if (map.popups[i].visible()) { 
      map.popups[i].hide(); 
     } 
    } 
    if (map.popups.indexOf(this.popup) == -1) { 
     map.addPopup(this.popup, false); 
     this.popup.marker = this.marker; 
    } 
    this.popup.show(); 
    this.marker.display(!this.popup.visible()); 
    OpenLayers.Event.stop(event); 
}; 

var lonLat1 = new OpenLayers.LonLat(0, 0).transform(defaultProjection, map.getProjectionObject()); 
var feature1 = new OpenLayers.Feature(markers, lonLat1); 
var marker1 = feature1.createMarker(); 
var popup1 = new OpenLayers.Popup.FramedCloud(
    'popup1', 
    lonLat1, 
    new OpenLayers.Size(200, 200), 
    'loading...', 
    null, 
    true, 
    closeCallback 
); 
feature1.data.icon = icon.clone(); 
feature1.popup = popup1; 
markers.addMarker(marker1); 
marker1.events.register('mousedown', feature1, clickCallback); 

var lonLat2 = new OpenLayers.LonLat(0, 0.5).transform(defaultProjection, map.getProjectionObject()); 
var feature2 = new OpenLayers.Feature(markers, lonLat2); 
var marker2 = feature2.createMarker(); 
var popup2 = new OpenLayers.Popup.FramedCloud(
    'popup2', 
    lonLat2, 
    new OpenLayers.Size(200, 200), 
    'loading...', 
    null, 
    true, 
    closeCallback 
); 
feature2.data.icon = icon.clone(); 
feature2.popup = popup2; 
markers.addMarker(marker2); 
marker2.events.register('mousedown', feature2, clickCallback); 

如果點擊彈出窗口的關閉按鈕，會觸發事件。但是，如果我點擊另一個標記，它不會被解僱。

map.addPopup(this.popup, false); 

而且當我設置獨家爲true（addPopup的第二個屬性），所以，如果一個新出現的事件不解僱所有彈出窗口會被隱藏。

謝謝你的幫助。

Answer 1

直到更好的解決方案存在，我認爲我們可以使用下面的一個：

改寫從OpenLayers.Popup的addCloseBox方法。查看我所做的更改。

/** 
* Method: addCloseBox 
* 
* Parameters: 
* callback - {Function} The callback to be called when the close button 
*  is clicked. 
*/ 
OpenLayers.Popup.prototype.addCloseBox = function(callback) { 

    this.closeDiv = OpenLayers.Util.createDiv(
     this.id + "_close", null, {w: 17, h: 17} 
    ); 
    this.closeDiv.className = "olPopupCloseBox"; 

    // use the content div's css padding to determine if we should 
    // padd the close div 
    var contentDivPadding = this.getContentDivPadding(); 

    this.closeDiv.style.right = contentDivPadding.right + "px"; 
    this.closeDiv.style.top = contentDivPadding.top + "px"; 
    this.groupDiv.appendChild(this.closeDiv); 

    // COMMENT OUT THIS DEFINITION OF 'closePopup' 
    //var closePopup = callback || function(e) { 
    // this.hide(); 
    // OpenLayers.Event.stop(e); 
    //}; 

    // NEW DEFINITION OF 'closePopup' 
    var closePopup = function(e) { 
     this.hide(); 
     /* Checks whether the callback is a function */ 
     if (typeof callback == 'function') { 
      /* Triggers the callback */ 
      callback(); 
     } 
     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)); 
}; 

:)