[OpenLayers-Users] Proportional Symbol Mapping

Andreas Hocevar andreas.hocevar at gmail.com
Sun Apr 6 13:24:40 EDT 2008


Bjorn,

your requirement is covered by the new OpenLayers.StyleMap.

First of all, have a look at the styles-context example 
(http://www.openlayers.org/dev/examples/styles-context.html). The second 
example there (the points in the southern hemisphere) are created with 
an advanced template. The same can be done for your use case.

If I take your original code for the calculation of the size:

feature.style.pointRadius = 3 + (pop * (40 / 1312978855));
feature.style.fillColor = feature.attributes['colour'];

I can create the following template:

var context = {
    getSize: function(feature) {
        return feature.attributes["population"] * someFactor * map.getScale();
    },
    getColour: function(feature) {
        return feature.attributes["colour"];
    }
};
var template = {
    fillOpacity: 0.9
    pointRadius: "${getSize}", // using context.getSize(feature)
    fillColor: "${getColour}"  // using context.getColour(feature)
};

var style = new OpenLayers.Style(template, {context: context});
vectors = new OpenLayers.Layer.Vector("Vector Layer", {
    styleMap: new OpenLayers.StyleMap(style)});


You only have to find an algorithm to derive your pointRadius from 
(using map.getScale() or map.getResolution() and someFactor).

Also, there is no need to set any feature styles in the onload method. 
You're all set with the above definition of the styleMap in the 
constructor for your vector layer.

Regards,
Andreas.

Bjorn Sandvik wrote:
> My question: Is there a way to keep the relative size of the symbols 
> when the users zoom in/out?
> (symbols should keep their size relative to the size of the countries).
>   




More information about the Users mailing list