Search code examples
leaflettilemapbox

Smooth transition between Leaflet layers


I've got 2 tilelayers on a Leaflet/Mapbox map and I am able to toggle between the layers, similar to this map. The difference is that my two layers are of the same type, both showing 'bike stations' to continue with the linked example.

Since I'm adding and removing the layers for each click, there's a small delay between the removal of the first layer and the adding of the second layer. I think I need to listen for when the second layer has finished loading, the removing the first layer to get a smooth transition between the two.

Is there any built-in functionality in Leaflet or Mapbox for accomplishing this?

UPDATE: I managed to work around this problem by using the setOpacity method of the tilelayers instead of reloading them for each click. But I'm still curious as to whether there exists a ready-method as described above.


Solution

  • There's nothing built-in to accomplish this, but it's something we might cover with an example in the future.