2

I'm adding layers to a GeoExt map panel map dynamically in response to a user's selection. I have a corresponding FeatureStore definition from which I create the layers. When a new layer is added, I'd like it to be the top most layer.

var vecLayer = new OpenLayers.Layer.Vector(natureOfAttack, {
            styleMap: new OpenLayers.StyleMap({
                'default': style
            }),
            protocol: new OpenLayers.Protocol.HTTP({
                url: "./server/maps/incidents.php",
                params: {natureOfAttack: natureOfAttack},
                format: new OpenLayers.Format.GeoJSON()
            }),
            strategies: [new OpenLayers.Strategy.Fixed()]
        });
        layers.push(vecLayer);

        // manually bind store to layer
        me.getIncidentMapStore().bind(vecLayer);

        mapPanel.map.addLayers(layers);

        // some more controls
        var selectCtrl = new OpenLayers.Control.SelectFeature(vecLayer);
        mapPanel.map.addControl(selectCtrl);

        vecLayer.events.on({
            'featureselected': function(e) {
                me.showIncidentDetailPopup(e.feature);
            }
        });

        selectCtrl.activate();

        // for dev purpose
        map = mapPanel.map;
        mapPanel = mapPanel;

I've then added:

var cLayer = map.getLayersByName(natureOfAttack)[0];
    map.setLayerIndex(cLayer, map.layers.length+1);

in an attempt to make the layer the top most layer, but this doesn't seem to work.

Having thought about it for a while, I came to the conclusion that I should probably have a listener in the store definition as shown below:

Ext.define('CMD.store.SampleStore', {
    extend: 'GeoExt.data.FeatureStore',
    model: 'CMD.model.Summit',
    autoLoad: false,

    listeners: {
        add: function(thisStore, records, index) {
            console.log('FeatureStore: A new layer added...');
        }
    }
});

but the event in the listener is not executed. Any idea on how I can achieve this will be appreciated.

UPDATE:

I've added:

vecLayer.events.on(
        'loadend': function(layer) {
            map.setLayerIndex(layer, map.getLayerIndex(layer)+5);
        }
    });

to the vector layer. This makes the created vector layer the top most layer. However, the error TypeError: a.setZIndex is not a function is generated.

UPDATE:

My environment: GeoExt 2, ExtJS 4, OpenLayers 2.12.

1

you can try map.raiseLayer function. Following code will help you to make your added layer to the top most layer with getting the length of layers.

map.raiseLayer(addedLayer, map.layers.length);

i hope it helps you...

  • Thanks a lot. This also makes the layer the top most layer. But it also generates the error TypeError: a.setZIndex is not a function. – okello Feb 4 '13 at 8:23
  • May be this might help: I'm using GeoExt 2 with ExtJS 4. – okello Feb 4 '13 at 12:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.