Удалить все всплывающие окна из функций OpenLayers - PullRequest
5 голосов
/ 14 февраля 2012

Я использую 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);
}

Карта может содержать много маркеров.

При нажатии на маркер всплывающее окно включается и выключается. Я пытаюсь сделать так, чтобы закрывались ВСЕ всплывающие окна, относящиеся ко всем маркерам на карте, при нажатии нового маркера и включении всплывающего окна - то есть я хочу, чтобы одновременно отображалось только одно всплывающее окно.

Возможно, мой подход неверен, но был бы благодарен за указатели, даже за идеи, которые можно попробовать.

Ответы [ 3 ]

11 голосов
/ 26 июня 2012

Если вы реализуете решение, в то время как только одно всплывающее окно активно одновременно (т.е. каждый раз, когда всплывающее окно не выбрано, оно исчезает), вы НИКОГДА не будете иметь более одного всплывающего окна за раз.

прочитайте этот 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]);
    }
}
1 голос
/ 14 февраля 2012

Почему бы вам не бросить открытые всплывающие окна в массив в ветви if(this.popup == null), а в цикле ветвления else над этим массивом и скрыть все всплывающие окна.

1 голос
/ 14 февраля 2012

Что я помню об 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);
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...