Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

I have a several hundred points that I am showing on a map. At the moment, my method of adding the points seems inefficient. I create an array using the following approach:

var features = [new OpenLayers.Feature.Vector(OpenLayers.Geometry.fromWKT("POINT(-4.2522971 45.3447353)").transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject()),{"Name":"aaa"}),
new OpenLayers.Feature.Vector(OpenLayers.Geometry.fromWKT("POINT(-4.259215 45.344827)").transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject()),{"Name":"bbb"})]

and then add this array to a map-layer:

var vectors = new OpenLayers.Layer.Vector("vector", {isBaseLayer: false, projection:"EPSG:4326", styleMap:myStyle});    

vectors.addFeatures(features);
map.addLayer(vectors);

Is there are a more efficient way of displaying the points? I also want to be able to dynamically change the radius of each point separately. I'm not sure if that is something that I should consider when constructing the point. For example, I can choose the radius when constructing, but I do not know how to update it:

new OpenLayers.Feature.Vector(OpenLayers.Geometry.fromWKT("POINT(-4.2522971 45.3447353)").transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject()),{"Name":"aaa"}, {radius: 10})
share|improve this question
add comment

2 Answers

up vote 3 down vote accepted

Regarding the second part of your question you can modify a features style and then redraw the feature using the drawFeature method of the layer. Example:

feature.style.pointRadius = (feature.style.pointRadius - 1) || 50;
feature.layer.drawFeature ( feature );

Regarding the first part of your question I would assume it is more efficient to use a Geometry.Point constructor directly. I would further assume it would be better to reuse your projection but I doubt you'll notice a performance difference. Here is full source for creating random features and resizing the radius:

function addRandomMarkers(extent, layer) {
    var features, dx, dy;
    dx = extent.getWidth();
    dy = extent.getHeight();

    features = array.map($.range(0, 100), function () {
        return new ol.LonLat(extent.left + dx * Math.random(), extent.bottom + dy * Math.random());
    });
    features = array.map(features, function (item) {
        return new ol.Geometry.Point(item.lon, item.lat);
    });
    features = array.map(features, function (item, index) {
        var attributes, style;
        attributes = null;
        style = { pointRadius: Math.round(1 + index / 10) };
        return new ol.Feature.Vector(item, attributes, style);
    });

    layer.addFeatures(features);

    features[10].style.pointRadius = 50;

    setInterval(function () {
        var feature = features[10];
        feature.style.pointRadius = (feature.style.pointRadius - 1) || 50;
        feature.layer.drawFeature ( feature );
    }, 500);
}
share|improve this answer
    
Thanks for the suggestion. I'm having difficult with the following piece: features[10].style.pointRadius = 50; returns the following error: TypeError: Cannot set property 'pointRadius' of null –  djq Aug 14 '12 at 20:30
    
That is because I'm using helper methods that are not available to you but the intent should be clear. You can get the helper methods from pastebin.com/s1zdME79 but the idea here is you can update the style and call drawFeature. –  ca0v Aug 15 '12 at 14:34
add comment

If there's too many points, probably you can go for Cluster. OpenLayers do have this feature.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.