L.esri.Vector.vectorTileLayer: setting `style.layers` in the `style` property not working
Closed this issue · 4 comments
Describe the bug
When setting the style layers in the following format, at esri-leaflet-vector v4.2.1 it does not work anymore:
L.esri.Vector.vectorTileLayer(
myUrl,
{
style: function (style) {
style.layers[0].paint = ...;
return style;
}
}
);
Reproduction
-
Go to https://jsbin.com/xohapiz/2/edit?html,output which uses
esri-leaflet-vector
v4.2.0. -
Go to https://jsbin.com/xohapiz/3/edit?html,output which uses
esri-leaflet-vector
v4.2.1.
Logs
No response
System Info
leaflet@1.9.4
esri-leaflet@3.0.12
esri-leaflet-vector@4.2.1
Additional Information
v4.2.1 was an update to Maplibre v3, #201 ... so that is most likely the cause of this. Here is the changelog for that: https://github.com/maplibre/maplibre-gl-js/releases/tag/v3.0.0
It seems like a workaround is to clone the JSON style object instead of just modifying it directly:
L.esri.Vector.vectorTileLayer(
myUrl,
{
style: function (style) {
const styleClone = JSON.parse(JSON.stringify(style)); // < ADDED LINE!
styleClone.layers[0].paint = ...;
return styleClone;
}
}
);
Here is a sample showing it working at esri-leaflet-vector@4.2.1:
https://jsbin.com/xohapiz/7/edit?html,output
We think this may be an issue with maplibre-gl ... so we may need to log a bug over there if we can pull together a replicable test case. Until then, we will use this workaround.
I logged a bug for this in maplibre-gl-js
: maplibre/maplibre-gl-js#4472
A fix for this in maplibre-gl-js was merged: maplibre/maplibre-gl-js#4488 .. so this should be fixed once that is released. I'll leave this open until I'm able to verify with the new version, then I'll close this item.
This is fixed in esri-leaflet-vector
v4.2.5, see here: https://jsbin.com/pulocim/2/edit?html,output