AW: [OpenLayers-Users] Change vector style dynamically

Arnd Wippermann arnd.wippermann at web.de
Thu Oct 27 17:10:43 EDT 2011


Hi,

U can use a styleMap with context and set the color by attribute "routes".

function set_styleLine()
{
    var context = {
        getColor : function (ft){
            if(ft.attributes.routes=="all")
                return "#000000";
            else
                return "#FF0000";
        }
    };
    var template = {
        strokeColor: "${getColor}",
        strokeOpacity: 1,
        strokeWidth: 3,
        fillColor: "#00AAFF",
        fillOpacity: 1,
        pointRadius: 8,
        pointerEvents: "visiblePainted"
    };

    var templateB = {
        strokeColor: "#FFFF00",
        strokeOpacity: 1,
        strokeWidth: 3,
        fillColor: "#FFFF00",
        fillOpacity: 0.25,
        pointRadius: 5,
        pointerEvents: "visiblePainted"
    };

    var styleMap = new OpenLayers.StyleMap({ "default" : new
OpenLayers.Style(template, {context:context}), 
                                          "select" : new
OpenLayers.Style(templateB, {context:context})
                                      });
    return(styleMap);
}

var styleLine = set_styleLine();
 
Or you add an attribute for the color to your route features. Then you
doesn't need the context.

Instead retrieve the color by 

strokeColor: "${yourAttributeForColor}",


Arnd

-----Ursprüngliche Nachricht-----
Von: openlayers-users-bounces at lists.osgeo.org
[mailto:openlayers-users-bounces at lists.osgeo.org] Im Auftrag von Maxime
Phaneuf
Gesendet: Donnerstag, 27. Oktober 2011 21:59
An: users at openlayers.org
Betreff: [OpenLayers-Users] Change vector style dynamically

Hi,

I'm developping a map where the baselayer is Google and the overlay layers
are GeoJSON I build server side.

    var busRoutes = new OpenLayers.Layer.Vector("routes", {
        visibility: true,
        style: styleLine,
        strategies: [new OpenLayers.Strategy.Fixed()],
        protocol: new OpenLayers.Protocol.HTTP({
            url: GlobalParams.MakeUrl("mapHandler.ashx"),
            format: new OpenLayers.Format.GeoJSON(),
            params: { 'routes': 'all', 'action':'route' }
        })
    });

This works as expected. I can see my layer no problem, with the style being:

    var styleLine = new OpenLayers.Style({ 'strokeColor': '#000000'});
    var styleLineSelect = new OpenLayers.Style({ 'strokeColor': '#FF0505'
});
    var styleLineTemp = new OpenLayers.Style({'strokeColor':'#ffffff'});
    var smLine = new
OpenLayers.StyleMap({'default':styleLine,'select':styleLineSelect,
'temporary':styleLineTemp});

This busRoute layer shows every bus routes. Sometimes, a user will only need
to see one route instead of all. So, I built a custom layer changer where
I'm refreshing this layer with this code:

map.getLayersByName('routes')[0].refresh({ force: true, params: { 'routes':
routeNumberJSON, 'action':'route'} });

This also works as expected. I can see the specific route on the map.

The problem is that I cannot change the style (stroke color)  for this
particular route. I tried setting a new style and stylemap for the layer,
and a new style for the new features. Nothing seems to work. It always keeps
the #000000 (black) stroke color. I really need to be able to change style
dynamically when I refresh the layer. I know my new style and style are
valid.

Is it possible to change style dynamically in OpenLayers?

Thanks,
Maxime

--
View this message in context:
http://osgeo-org.1803224.n2.nabble.com/Change-vector-style-dynamically-tp693
7851p6937851.html
Sent from the OpenLayers Users mailing list archive at Nabble.com.
_______________________________________________
Users mailing list
Users at lists.osgeo.org
http://lists.osgeo.org/mailman/listinfo/openlayers-users



More information about the Users mailing list