[OpenLayers-Users] Change Vector Point feature class styles dynamically.

[Jonathan Sawyer]

Hi all,

I have a Vector layer being initialized with a default style. I am then
adding new vector features (Points) dynamically via Ajax calls and GeoJSON
data.

Anyway, if I try to apply a non-default style to a Point dynamically using
something similar to this code:

{{{
        /* init code */

        var defaultStyle = new OpenLayers.Style({
            pointRadius: "${radius}",
            fillColor: "#00ddff",
            fillOpacity: 1,
            strokeColor: "#008899",
            strokeWidth: 1,
            strokeOpacity: 1,
        }, {
            context: {
                radius: function(feature) {
                    var pix = 3;
                    if (feature.cluster) {
                        pix = Math.min(feature.attributes.count, 5);
                    }
                    return pix;
                },
                width: function(feature) {
                    return (feature.cluster) ? 3 : 1;
                }
            }
        })

       var layer = new OpenLayers.Layer.Vector("the name", {
                strategies: strat, // Cluster, Fixed
                protocol: new OpenLayers.Protocol.HTTP({
                    url: data.url, // the URL
                    format: frmt // GeoJSON
                }),
                projection: new OpenLayers.Projection('EPSG:4326'),
                styleMap: new OpenLayers.StyleMap({
                    "default": defaultStyle,
                    "select": {
                        fillColor: "#8aeeef",
                        strokeColor: "#32a8a9"
                    }
                })
            })

       map.addLayer(layer); // ==> map.layers[2]

        /* problem code */

       // map.layers[2].features[0] is the first point (in thousands of
points) in this layer
       map.layers[2].features[0].style = new OpenLayers.Style({
                pointRadius: "${radius}",
                fillColor: "#7766ff",
                fillOpacity: 1,
                strokeColor: "#2222ff",
                strokeWidth: 1,
                strokeOpacity: 1
            }, {
                context: {
                    radius: function(feature) {
                        var pix = 3;
                        if (feature.cluster) {
                            pix = Math.min(feature.attributes.count, 5);
                        }
                        return pix;
                    },
                    width: function(feature) {
                        return (feature.cluster) ? 3 : 1;
                    }
                }
            });
}}}

the Point in this layer disappears. What I want to do is change the style to
anything I want.

I must be missing something or misunderstanding how styles are applied in
OpenLayers. Thanks in advance for any and all help. I really appreciate it.

-- 
Jonathan Sawyer
Geographic Information Network of Alaska (GINA)
University of Alaska Fairbanks
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.osgeo.org/pipermail/openlayers-users/attachments/20091014/ff2a530a/attachment.html