[Fixed] Switching programmatically between layers in Leaflet on Angular


I have to display layers which do not support all zoom-levels in Leaflet on Angular. These are WMTS-Layers loaded from external servers.

See example below:

Zoom-Level 12

Zoom-Level 13

How can i switch programmatically to a Layer which supports the corresponding zoom-layer to keep a usage-flow?
It’s not very easy for users to understand clearly that the layers are supportet not in every zoom-level.

The layer is use is configured as followed:

var baseMap = new L.TileLayer(
      maxZoom: 15,
      attribution: '© source',


Listen on the zoomend event and add / remove the layer if zoom is greater / lower.

var MIN_LAYER_ZOOM_LEVEL = 14; // Zoom level until layer is visible

   var currentZoom = map.getZoom();
   if(currentZoom >= MIN_LAYER_ZOOM_LEVEL){

Leave a Reply

(*) Required, Your email will not be published