Layers do not align with basemap (regression) when using Maplibre GL JS v4

[gavinr-maps]

Describe the bug

This is a regression (same issue) on #130.

Starting at Esri Leaflet Vector v4.2.4, if you zoom out then pan up (or down), the layers will be misaligned with the basemap.

Reproduction

1. Open https://jsbin.com/bilemud/3/edit which uses esri-leaflet-vector v4.2.3
2. Pan the map down (off the screen)
   • Expected: Points and basemap pan off the screen, and the basemap is never mis-aligned with the points
   • Actual: Points and basemap pan off the screen, and the basemap is never mis-aligned with the points ✅
3. Open https://jsbin.com/jexevoy/4/edit which uses esri-leaflet-vector v4.2.4
4. Pan the map down (off the screen)
   • Expected: Points and basemap pan off the screen, and the basemap is never mis-aligned with the points
   • Actual: The points pan off the screen, but the basemap stays in view, so the basemap is mis-aligned with the points. ❌

Additional Reproduction

Also note, this issue can be seen in the current Esri Leaflet documentation, for example here: https://developers.arcgis.com/esri-leaflet/samples/simple-feature-layer/

https://github.com/user-attachments/assets/9e4a0d70-aa07-4a8c-90bf-f61a75b581d6

System Info

- Leaflet version: 1.9.4
- Esri Leaflet version: 3.1.0
- Esri Leaflet Vector version: 4.2.4

Additional Information

In Esri Leaflet Vector v4.2.4 was when we upgraded to Maplibre GL JS v4, so I think this issue is caused by a change in Maplibre GL JS v4.

[gavinr-maps]

In Esri Leaflet Vector v4.2.4 was when we upgraded to Maplibre GL JS v4, so I think this issue is caused by a change in Maplibre GL JS v4.

Investigating Maplibre v4, it seems like the behavior of the map when setting these settings:

gl.transform.latRange = null;
gl.transform.maxValidLatitude = Infinity;

...has changed in Maplibre v4.1.1.

Replication Case - Maplibre

1. Open https://codepen.io/gavinr/pen/dPbQRed?editors=1010
2. Pan the map down out of the view port
   • Expected: the map can be panned completely out of the viewport
   • Actual: the map can be panned completely out of the viewport ✅
3. Open https://codepen.io/gavinr/pen/WbeYOmN?editors=1010 (same code as above, but using maplibre v4.1.1)
4. Pan the map down out of the view port
   • Expected: the map can be panned completely out of the viewport
   • Actual: the map can only be panned halfway out of the viewport ❌

[patrickarlt]

I can't find the CodePen I have for this but I think it war mostly just recycled ideas from https://github.com/Esri/esri-leaflet-vector/issues/130#issuecomment-1215740071 setting max bounds. I think I used Infinity and -Infinty to make sure you could pan across the date line.

[patrickarlt]

@gavinr-maps do you think that you could get this working now that https://github.com/maplibre/maplibre-gl-leaflet/pull/66 is merged?

[gavinr-maps]

@patrickarlt unfortunately not. My PR at least got it working (not crashing) with Maplibre 5, but it's still having the same issues we are having even after that PR: https://github.com/maplibre/maplibre-gl-leaflet/issues/73#issuecomment-2960352327