Openlayers и события на нескольких уровнях (OpenLayer.Layer.Vector)

Ответ 1

Я нашел это, когда у меня была такая же проблема, пытаясь заставить несколько слоев реагировать на события мыши.

Решение, на всякий случай, если кто-либо еще найдет этот поток намного проще.

Элемент управления SelectFeature принимает массив слоев Vector, и если все латнеры, которые вам нужно реагировать на события мыши (наведите указатель мыши и нажмите), находятся в этом массиве, они ВСЕ работают, а не только тот, который был перемещен в начало.

Итак, в одобренном решении этой темы это может быть значительно упрощено, если:

this.carSelect = new OpenLayers.Control.SelectFeature(
    [this.vectorsLayer, this.carsLayer],
    {
        'hover':true,
        'callbacks': {
            blah blah blah
    }
});

Это приведет к регистрации соответствующих событий на обоих уровнях и сделает их живыми.

Я надеюсь, что это поможет кому-то еще наткнуться на эту проблему.

Как сказано в другом месте, использование OpenLayers не сложно, найти правильный способ сделать что-то с ним.

Ответ 2

это решает мою проблему:

до:

      map.addLayer(layer);
      layer.events.register("loadend", layer, function(){
        $("#progress").hide();
      });

после:

      layer.events.register("loadend", layer, function(){
        $("#progress").hide();
      });
      map.addLayer(layer);

Надеюсь, что это поможет

Ответ 3

Хорошо это решение:

/*
* This method will be called each time you add more vector layers to your map.
* i get more data with ajax calls and some of this data will go to existing layers,
* some of it will go to new layers... Some layers will be added and some removed. 
*/

OpenMap.prototype.bindFeatureEvents = function (arr){
    var that = this;
    if ( this.initialized == true ){
    /* if map is already initialized we deactivate and remove control - 
    * we will re add it later. I havent tested if its really necessary...
    */
        this.carSelect.deactivate();
        this.mymap.removeControl(this.carSelect);
    } else {
        this.carSelect = new OpenLayers.Control.SelectFeature([], {
            'hover':true,
            'callbacks':{
                'click':function(f){
                    if ( typeof f.attributes.data.id != 'undefined'){
                        that.selectCar(f.attributes.data.id);
                    }
                }
        }});

        this.vectorsLayer.events.on({
            'featureselected': this.onFeatureSelect.bind(this),// these methods open and close popups.
            'featureunselected': this.onFeatureUnselect.bind(this)
        });

        this.carsLayer.events.on({
            'featureselected': this.onFeatureSelect.bind(this),
            'featureunselected': this.onFeatureUnselect.bind(this),
            'moveend': function(e) {
                if (e.zoomChanged) {
                    if (this.watchCar == true){
                        this.holdZoom = true;
                    }
                }
             }.bind(this)//without this the "this" in moveend callback is openlayers.layer.vector
        });
        /*
        * I save existing layers in two arrays... It seemed simpler to use two arrays.. 
        * or you could of course use one Object instead of two Arrays... 
        * and you really need to bind events to each layer only once... otherwise each rebinds
        * makes events firing more and more. 
        * each time bindFeatureEvents is called.. new events would be added.
        */
        var name = this.vectorsLayer.name;
        this.boundLayers.push(name)
        this.allLayers.push(this.vectorsLayer);
        var name = this.carsLayer.name;
        this.boundLayers.push(name)
        this.allLayers.push(this.carsLayer);
        this.initialized = true;
    }
    /*
    * We need to check if any arr was provided at bindFeatureEvents call. 
    * if not.. then ohwell. pass :P
    */
    if ( arr != null && typeof(arr)=='object' && arr instanceof Array && arr.length > 0 ){
        for ( i = 0 ; i < arr.length; i++){
            var name = arr[i].name;
            if ( name in oc(this.boundLayers) ){
                 // Tell me how to skip this part... 
            } else {
            //we add new layer to both arrays.
                this.boundLayers.push(name);
                this.allLayers.push(arr[i]);
            }
        }
    }
    /*
    * this next line is what made it sensible to use two arrays... you can
    * feed all layers easyer to setLayer method
    * We could also use bit of code to check if some layers were removed... 
    */
    this.carSelect.setLayer(this.allLayers);
    this.mymap.addControl(this.carSelect);
    this.carSelect.activate();
    /*
    * Yeah the control is acitvated again and the events are firing on all layers...
    */
};

//taken from http://snook.ca/archives/javascript/testing_for_a_v
function oc(array){
    var o = {};
    for(var i=0;i<array.length;i++){
        o[array[i]]='';
    }
    return o;
};

Ответ 4

Для меня большая честь упоминаться так!: -)

Я закончил переопределение функции активации в обработчике Feature в дополнительном файле js: (Прокомментированная строка - единственная разница.)

OpenLayers.Handler.Feature.prototype.activate = function() {
    var activated = false;
    if (OpenLayers.Handler.prototype.activate.apply(this, arguments)) {
        //this.moveLayerToTop();
        this.map.events.on({
            "removelayer": this.handleMapEvents,
            "changelayer": this.handleMapEvents,
            scope: this
        });
        activated = true;
    }
    return activated;
};

Я также обнаружил, что элементы управления select работали над слоями, которые не были сверху, поэтому я считаю, что ваш подход с использованием нескольких слоев в элементе управления выглядит хорошо.