change the icon size when i make zoom (not cluster)

[Nuno Dias]

hello!

i want to change the icon size when i make "zoom in" or "zoom out" and after i want that icon disappear when the zoom is out out out it´s possible?something like this example who i found: http://danzel.github.com/Leaflet.markercluster/example/marker-clustering-realworld.388.html

thank you

Nuno Dias

[Paulo Vieira]

Hey there Nuno!

This is simple. You just have to add a listener function to the map event "zoomend". The listener function should obtain the current zoom level and set the correct size of the icon.

One important issue is to also set the correct "iconAnchor" property, otherwise the icon will be misplaced. For symmetric icons (like the default one), this is easy. I'm not sure about non-symmetric icons, it will probably require a little calculation.

Here is a simple example: http://jsfiddle.net/paulovieira/vNLaP/

Nuno Dias

--
 
 
 

[Tim Niblett]

Nuno,

Paulo's solution is very simple.  I'm probably over-fussy but I don't like scaling images as you get blurriness, especially on retina displays and/or when you scale to a factor larger than one.  

I wrote a small package some time ago that uses font icons for markers, which scale perfectly.  You can either use the naked icons (ie the map pin) or for more complex glyphs go to a "bubble" marker.  There is a demo here, and the code is here.  Its more work and more code but looks prettier (to my eye).  You may not like the extra download weight of the font(s) of course.

I don't hide markers at a certain zoom, but instead change to a map pin at some point and use the fantastic marker cluster plugin to collapse multiple markers at other levels.  You can of course hide markers, but it might be a bit confusing.  I can tell you how if that's what you really want...

Cheers 

Tim