This one really stumped me at first. I unfortunately don't have a link to share to replicate, but I can work on that if others are finding this a problem too. Basically, I have a menu in my app where I can select/deselect tables to be included in my vector tile layer, as well optional filters, that zoom to specific county area. When switching to a different layer, I would find the bounds of the new area, zoom to it, and then re-add the vectorgrid layer using the updated layer list. But the map would be blank. If I zoomed or moved around, the tiles would load as normal.
Which is called from _getVectorTilePromise. After some debugging, I saw that the this._map._animateToZoom level was not matching the level in the coords. I realize that the animateToZoom level is probably being used to catch the zoom transition before the tile requests are made, but in my case, it resulted in a blank map.
I worked around the problem by manually updating the this._map._animateToZoom value in this specific case in my app.
zoomEnd$.take(1).subscribe(()=>{
//make sure leaflet's internal _animateToZoom matches the current zoom
if((this.leafletMap as any)._animateToZoom !== this.leafletMap.getZoom()){
(this.leafletMap as any)._animateToZoom = this.leafletMap.getZoom();
}
let mvtTiles = this.leafletLayerService.getMvtTileLayer(cfb,this.leafletMap);
I'm not sure if this is really a vectorgrid problem or a leaflet bug/limitation, but it was tricky to track down, so hopefully this helps someone-
This one really stumped me at first. I unfortunately don't have a link to share to replicate, but I can work on that if others are finding this a problem too. Basically, I have a menu in my app where I can select/deselect tables to be included in my vector tile layer, as well optional filters, that zoom to specific county area. When switching to a different layer, I would find the bounds of the new area, zoom to it, and then re-add the vectorgrid layer using the updated layer list. But the map would be blank. If I zoomed or moved around, the tiles would load as normal.
I tracked the problem to this function:
https://github.com/Leaflet/Leaflet.VectorGrid/blob/13315057d285bfa5d5cb74d2abb442e925825b55/src/Leaflet.VectorGrid.Protobuf.js#L89-L103
Which is called from
_getVectorTilePromise
. After some debugging, I saw that thethis._map._animateToZoom
level was not matching the level in the coords. I realize that the animateToZoom level is probably being used to catch the zoom transition before the tile requests are made, but in my case, it resulted in a blank map.I worked around the problem by manually updating the
this._map._animateToZoom
value in this specific case in my app.I'm not sure if this is really a vectorgrid problem or a leaflet bug/limitation, but it was tricky to track down, so hopefully this helps someone-