Leaflet :: Changing Icon Based On Zoom Level

How do I go about changing an icon height & width based on Leaflet zoom level? I'm using Leaflet api v0.7.5

Solution 1:

Use the L.Marker.setIcon method together with the map's zoomend event, i.e.:

var marker = L.marker(…).addTo(map);
var bigIcon = L.icon(…);
var smallIcon = L.icon(…);

map.on('zoomend', function(ev){
  if (map.getZoom() > 16) {
    marker.setIcon(bigIcon);
  } else {
    marker.setIcon(smallIcon);
  }
})

Also, note that Leaflet 0.7.5 is deprecated. You are encouraged to switch to 1.0.0-rc3 (which is the latest available at the time of this writing).