CODEWITHSUNDEEP
colorspolygonopenlayers-3
Geologic
Geologic

Reputation: 51

openlayers polygon change color

i'm using OL3 and javascript to draw several polygon on a map. Each polygon came from a database in WKT format like "POLIGON((39 -9, ....))". I can draw them on the map but i want to change fill color of each one, but don't know how to do it. Here is my code:

//WKTpoly -> this is my array of POLYLINES
var format = new ol.format.WKT();
var vectorArea = new ol.source.Vector({});
for (var i=0;i<WKTpoly.length;i++) {    
    var featureGeom = format.readFeature(WKTpoly[i]);
    featureGeom.getGeometry().transform('EPSG:4326', 'EPSG:3857');
    vectorArea.addFeature(featureGeom);
}
    VectorMap = new ol.layer.Vector({
        name: map,
        source: vectorArea,
    });

    map.addLayer(VectorMap);

Upvotes: 1

Views: 3932

Answers (2)

David
David

Reputation: 336

Or you can setup the layer to use a function as style

the function signature is

var makeStyle = function(feature,resolution) {

return [styles];
};

You can use this to manage style by feature and resolution (zoom level). As the function is called at each feature render, you'll need to cache the style in a js object to gain performance.

Upvotes: 0

Geologic
Geologic

Reputation: 51

Well, after LessThanJake response and some more google search, i found the solution, i had to create a style and call setStyle() before addFeature():

(...)
  var style = new ol.style.Style({
     fill: new ol.style.Fill({
          color: FillColor,
          weight: 1
        }),
     stroke: new ol.style.Stroke({
          color: LineColor,
          width: 1
     })
  });
  featureGeom.setStyle(style); 

(...)

Thanks LessThanJake for pointing the right direction.

Upvotes: 3

Related Questions