Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

L.esri.Vector.vectorTileLayer: setting style.layers in the style property not working #220

Closed
gavinr-maps opened this issue Jul 30, 2024 · 4 comments

Comments

@gavinr-maps
Copy link
Contributor

gavinr-maps commented Jul 30, 2024

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

  1. Go to https://jsbin.com/xohapiz/2/edit?html,output which uses esri-leaflet-vector v4.2.0.

    • Expected: parcels have different colors: yellow, green, red, blue.
    • Actual: parcels have different colors: yellow, green, red, blue ✅ image
  2. Go to https://jsbin.com/xohapiz/3/edit?html,output which uses esri-leaflet-vector v4.2.1.

    • Expected: parcels have different colors: yellow, green, red, blue.
    • Actual: parcels are not styled - all blue: image

Logs

No response

System Info

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

@gavinr-maps
Copy link
Contributor Author

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 [email protected]:
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.

@gavinr-maps
Copy link
Contributor Author

gavinr-maps commented Jul 30, 2024

I logged a bug for this in maplibre-gl-js: maplibre/maplibre-gl-js#4472

@gavinr-maps
Copy link
Contributor Author

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.

@gavinr-maps
Copy link
Contributor Author

This is fixed in esri-leaflet-vector v4.2.5, see here: https://jsbin.com/pulocim/2/edit?html,output

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant