[GIS] Creating choropleth map using OpenLayers

choroplethopenlayers

Is there any way to generate a chloropleth map using OpenLayers 3?

The map will contain static data that is stocked in a JSON variable.

The map will be published like the picture below:

exemple of choropleth map using Leaflet

Best Answer

Here is an example for OpenLayers 4 (not 3!):

getStyle = function (feature, resolution) {
    if (feature.get('my_attribute') < 10) {
        return new ol.style.Style({
            fill: new ol.style.Fill({
                color: [255, 0, 0, 0.5] // semi-transparent red
            })
        });
    }
    // else if ...
    else {
        return new ol.style.Style({
            fill: new ol.style.Fill({
                color: [255, 255, 0, 0.5] // semi-transparent yellow
            })
        });
    }
};

my_layer = new ol.layer.Vector({
    source: /* source definition here */,
    style: function (feature, resolution) {
        return getStyle(feature, resolution);
    }
});

The general approach is to define a function which returns the style or the fill color value depending on the value of a specified feature attribute.