Search code examples
leafletzoomingmarker

Leaflet hide markers in zoom levels


Is it possible to hide a marker on leaflet map in some specific zoom level?

I tried:map.on('zoomend', onZoomend); function onZoomend(){if(map.getZoom()>11){map.removeLayer(markername);}

BUT it is not working although it is the case for geometries.

I am not refering to marker cluster.


Solution

  • This code shows markers in zoom number equal and greater than 14 and for lesser hides marker from the map

    var mymap = L.map('mapid').setView([35.75, 51.375], 8);
    
    L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar'}).addTo(mymap);
    
    
    var marker = L.marker([35.75, 51.375],{
        draggable:true,
        title : 'title',
    });/
    
    mymap.on('zoomend' , function (e) {
        var geo = mymap.getCenter();
        console.log(mymap.getZoom());
        if (mymap.getZoom()>14)
        {
            marker.setLatLng(geo);
            marker.addTo(mymap);
        }else {
            marker.remove();
        }
    });
    

    https://jsfiddle.net/sajjadgol/6qprq9z9/3/