geostyler-openlayers-parser

🚀 GeoStyler Code Sprint 2024

We are happy to announce the third GeoStyler Code Sprint from 17.-21.06.2024 in Paris. Be part of it! More infos on https://geostyler.org/.

GeoStyler Style Parser implementation for OpenLayers styles

How to use

The example below shows how to take a raw GeoStyler style, use the OpenLayersParser to parse the style into an OpenLayers style, and then apply it to an OpenLayers vector layer.

ES6:

import OpenLayersParser from "geostyler-openlayers-parser";
import OlLayerVector from "ol/layer/Vector";

const pointSimplePoint = {
  name: "OL Style",
  rules: [
    {
      name: "OL Style Rule 0",
      symbolizers: [
        {
          kind: "Mark",
          wellKnownName: "circle",
          color: "#FF0000",
          radius: 6
        }
      ]
    }
  ]
};

const parser = new OpenLayersParser();
const layer = new OlLayerVector();

parser
  .writeStyle(pointSimplePoint)
  .then(({output: olStyle}) => layer.setStyle(olStyle))
  .catch(error => console.log(error));

Browser:

var pointSimplePoint = {
  name: "OL Style", rules: [{
    name: "OL Style Rule 0",
    symbolizers: [{
      kind: "Mark",
      wellKnownName: "circle",
      color: "#FF0000",
      radius: 6
    }]
  }]
};
var vectorLayer = new ol.layer.Vector();
var parser = new GeoStylerOpenlayersParser.OlStyleParser(ol);
parser.writeStyle(pointSimplePoint)
.then(function(style) {
    if (style.errors) {
      console.log(style.errors);
    } else {
      vectorLayer.setStyle(style.output);
    }
});

Funding & financial sponsorship

Maintenance and further development of this code can be funded through the GeoStyler Open Collective. All contributions and expenses can transparently be reviewed by anyone; you see what we use the donated money for. Thank you for any financial support you give the GeoStyler project 💞