Basemap not moving when dragging with the mouse

[mariocasciaro]

I'm embedding an esri-leaflet in an Angularjs application. I recently upgraded to esri-leaflet v3 (from v2) and to using the vectorBasemapLayer object for basemaps. However, when dragging the map using the mouse, the basemap wouldn't move. If there are other layers on the map, such as markers, they would move. The attribution text at the bottom of the map also gets updated correctly. If I drag the map and then zoom, then the basemap would refresh and it would show the right location.

I tried to remove every other component or layer from the map, and left just the setView() and the vectorBasemapLayer creation, in case they were the cause of the issue, but nothing changed.

Please see the GIFs below for a visual explanation:

Basemap doesn't move:

Dragging then zooming would update the basemap:

I've just replaced the old L.esri.basemapLayer with L.esri.Vector.vectorBasemapLayer so there must be something in vectorBasemapLayer that behaves differently or has a bug. Do you have any idea of what is happening?

[gavinr]

Hi, thank you for the report. Are you able to share a replication case (using something like https://codesandbox.io for example)?

[mariocasciaro]

Hi @gavinr. Can you please send me a DM on Twitter (DMs are open) so I can share my work email with you privately?

[jwasilgeo]

@mariocasciaro, can you check if your code happens to have this setting that might limit user panning?

https://leafletjs.com/reference-1.7.1.html#map-maxbounds

Otherwise can you create a public version of your use case?

[mariocasciaro]

Hi @gavinr @jwasilgeo here is a stripped-down version of the code I have in my project. I tried to reduce it to the bare minimum, so I essentially managed to remove all proprietary code. As you can see the use case is extremely basic. So I'm starting to thing that the problem has something to do with the build process? Even though even the build process is very standard and there's nothing special about it really (webpack 5 with some basic config) .

https://github.com/mariocasciaro/esri-leaflet-bug-demo

[jwasilgeo]

Thanks for making a demo we can access the source code of. At a glance I'm not sure what is missing or what could be causing this to happen. Can you also verify the same issue happens with any other layer type? For example, what if you try the deprecated basemap version like this one L.esri.basemapLayer("Gray").addTo(map); ?

[mariocasciaro]

Using basemapLayer the map works as expected.

On Wed, Oct 13, 2021, 20:14 Jacob Wasilkowski @.***> wrote:

Thanks for making a demo we can access the source code of. At a glance I'm not sure what is missing or what could be causing this to happen. Can you also verify the same issue happens with any other layer type? For example, what if you try the deprecated basemap version like this one L.esri.basemapLayer("Gray").addTo(map); ?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/Esri/esri-leaflet-vector/issues/103#issuecomment-942636220, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAAZWZ4CL7PRPHIZR64TEIDUGXK77ANCNFSM5F2NDEXA . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

[JJU115]

Hello, new to the discussion but I’ve also been using the esri-leaflet-vector plugin for use in an Angular application and am experiencing the same issue with the vectorBasemapLayer. Everything is as mariocasciaro describes it, just wanted to know if there has been any updates on this issue. Thanks.

[krdyke]

Chiming in that I've encountered the same issue, although I'm using React v17.0.2 rather than Angular.

[krdyke]

There's an issue for mapbox-gl-leaflet that shows similar behavior. It looks like the release of v1.13.2 of mapbox-gl introduced the issue. The current version of mapbox-gl in package.json of esri-leaflet-vector is: "^1.4.0", which loads 1.13.2. When I knocked it down to 1.13.1, everything appeared to go back to normal. Changing the package.json value for mapbox-gl to 1.4.0 - 1.13.1 may fix the issue.

[jwasilgeo]

That’s a very helpful find, thank you @krdyke!

We will look into this and consider what to potentially do about version numbers soon.

[jwasilgeo]

Fixed via https://github.com/Esri/esri-leaflet-vector/releases/tag/v3.1.1

[weca-theo]

Similar issue with mapbox-gl-leaflet.js fixed in: https://github.com/mapbox/mapbox-gl-leaflet/pull/155