Search code examples
openlayers

openlayer change feature attributes with a strategy


I change an attribute vale of a feature into a custom strategy but when the features are drawn the features don't take the new attribute value.

This is the test I'm doing:

OpenLayers.Strategy.LabelChange =  OpenLayers.Class(OpenLayers.Strategy, {

    activate: function() {
        var activated = OpenLayers.Strategy.prototype.activate.call(this);
        if(activated) {
            this.layer.events.on({
                "moveend": this.filter,
                scope: this
            });
        }
        return activated;
    },

    deactivate: function() {
        var deactivated = OpenLayers.Strategy.prototype.deactivate.call(this);
        if(deactivated) {
            this.layer.events.un({
                "moveend": this.filter,
                scope: this
            });
        }
        return deactivated;
    },

    filter: function()  {
        console.log('labels updated');
        for (var i = 0; i < this.layer.features.length; i++) {
            var f = this.layer.features[i];
            f.attributes.labelName = 'label updated';
        }
    }
});

var features = new Array(15);

// create random reatures
for (var i=0; i<features.length; i++) {
    var x = (360 * Math.random()) - 180;
    var y = (180 * Math.random()) - 90;

    features[i] = new OpenLayers.Feature.Vector(
        new OpenLayers.Geometry.Point(x ,  y), 
        {
            labelName: 'label '+ i
        }
    );
}

var style = new OpenLayers.Style({
    strokeWidth:0,
    pointRadius: 2,
    fillOpacity:0,
    label: "${labelName}",
    fontColor: "#333333",
    fontFamily: "sans-serif",
    fontWeight: "bold",
});

// Create a vector layer and give it your style map.
var labels = new OpenLayers.Layer.Vector("labels", {
    styleMap: new OpenLayers.StyleMap(style),
    strategies:[new OpenLayers.Strategy.LabelChange ()]

});

labels.addFeatures(features);

var map = new OpenLayers.Map({
    div: "map",
    layers: [
        new OpenLayers.Layer.WMS(
            "OpenLayers WMS",
            "http://vmap0.tiles.osgeo.org/wms/vmap0",
            {layers: "basic"}
        ),
        labels
    ],
    center: new OpenLayers.LonLat(0, 0),
    zoom: 1
});

Hear the jsfiddle: http://jsfiddle.net/ccrafael/aXyqW/1/

Thanks & regards, Rafael.


Solution

  • Finally the way a found was remove the features from layer, modify the features and add the features again to the layer.

    filter: function()  {
        console.log('labels updated');
        var features = this.layer.features;
        this.layer.removeAllFeatures();
        for (var i = 0; i < features.length; i++) {
            var f = features[i];
            f.attributes.labelName = 'label updated';
        }
        this.layer.addFeatures(features);
    }
    

    Here the fiddle: http://jsfiddle.net/ccrafael/aXyqW/2/