Convert ESRI styles to OpenLayers styles
npm install ol-esri-stylejavascript
import { createStyleFunction, createStyleFunctionFromUrl } from 'ol-esri-style';
// create a new vector layer
const vector = new VectorLayer({
...
});
const proj = map.getView().getProjection();
// set layer style directly from the layer URL
// Passing the projection is need for labeling features. Visible resolutions for
// the labels are calculated using map projection units.
createStyleFunctionFromUrl('arcgis_server_layer_url', proj).then(styleFunction => {
vector.setStyle(styleFunction);
});
// You can also retrieve the layer info yourself and use it to create the style
// function
fetch(${arcgis_server_layer_url}?f=json)
.then(res => res.json())
.then(json => createStyleFunction(json, proj))
.then(styleFunction => {
vector.setStyle(styleFunction);
});
`
You can modify the styles before applying them to the features:
`javascript
// set layer style
createStyleFunctionFromUrl('arcgis_server_layer_url').then(styleFunction => {
vector.setStyle((feature, resolution) => {
const styles = styleFunction(feature, resolution);
// modify styles
return styles;
});
});
`
Example
To check the example stored in /example directory run:
`bash
npm run dev
``