Package Exports

geostyler-openlayers-parser
geostyler-openlayers-parser/dist/OlStyleParser
geostyler-openlayers-parser/dist/OlStyleParser.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (geostyler-openlayers-parser) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

geostyler-openlayers-parser

GeoStyler Style Parser implementation for OpenLayers styles

🚀 GeoStyler Code Sprint 2025

We are happy to announce the next GeoStyler Code Sprint from 02.-06.06.2025 in Switzerland. Be part of it! More infos on https://geostyler.org/.

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 💞