OpenLayers 2 – How to Draw Feature with Style and Preserve After Map Redraw

openlayers-2style

The function that I am trying to work on is: click on a feature and change its color. I tried to approach this by first recreating the feature with custom style:

layer.drawFeature(feature, myStyle);

this gave me the desired shape but it was lost after layer redraw.

Then I tried to use a clone of the feature:

layer.drawFeature(feature.clone(), myStyle);

this time the new shape would not disappear but it's not sync with the map, i.e. it does not resize/ move with the map.

I do notice that the following post was about a similar issue. I wonder if there's a way without creating an extra overlay? I could live with the cloned feature thing if that can be put to work.

Openlayers – Losing selection or style on layer redraw

Any suggestions will be greatly appreciated!

Best Answer

The drawFeature function does not save the style. The feature is redrawn with the layer style again when the layer is redrawn. You may assign the style to the feature, and drawFeature again. Now when redrawing the feature, the assigned style will be used.

feature.style = myStyle;
layer.drawFeature(feature);

Have a look at the drawFeature documentation. It gives more detailed information.

Related Solutions

[GIS] how to get Coodinates after Resizing a feature Openlayers

It works, though you need to click back on the "draw regular polygon" radio so that it triggers the afterfeaturemodified. Or you could just use the featuremodified event so that as soon as you finish dragging or resizing it will trigger your function.

Also you'll need to change the var bounds = event.features[0].geometry.getBounds(); for var bounds = event.feature.geometry.getBounds(); because the event only returns one feature as appose to an array of features.

So i think this is what you're looking for:

vectors.events.on({
    featuremodified: featureModified
});

function featureModified(event) {

    var bounds = event.feature.geometry.getBounds();
    var answer = "bottom: " + bounds.bottom + "\n";
    answer += "left: " + bounds.left + "\n";
    answer += "right: " + bounds.right + "\n";
    answer += "top: " + bounds.top + "\n";
    alert(answer);
}

[GIS] Openlayers – Vector Layer – Combining hide/show features using style property

You are using the JavaScript switch - case construct incorrectly. You need to add a break statement at the end of each case block, e.g.

switch (f) { 

    /* ... */

    case 'type_2': 
        if (checked) {
            filter('show_type_2');
        } else {
            filter ('hide_type_2);
        }
        break;

    case 'shape_1': 
        if (checked) {
            filter('show_shape_1');
        } else {
            filter ('hide_shape_1);
        }
        break;

}

Note that the case keyword only marks the beginning of execution, and the next case keyword does not mean the end of execution. You have to use break or return if you want to leave the switch block once it was entered.

Best Answer

Related Solutions

[GIS] how to get Coodinates after Resizing a feature Openlayers

[GIS] Openlayers – Vector Layer – Combining hide/show features using style property

Related Question