Change anchor of leaflet icon

Question

I'm currently using a div icon to show a small graph as a marker on a leaflet map. The graphs change dynamically based on the day of week using data from a database, which changes the height of the graphs in the div icon HTML.

As the graphs change height I need to change the value of the icon anchor so the graphs remain attached to the correct location at their bottom left hand corner, using the heights of the graph to set this. Does anyone know of the best way to access and modify the anchors of div icons/markers once they've been added to the map? (I would prefer not to have to remove the makers and re-add them if possible)

Answer 1

The most simple would probably be to update the icon options (for iconSize and iconAnchor), then to use marker.setIcon(newOrUpdatedIcon) with the updated icon to re-draw the latter without affecting the marker latLng position.

Demo: http://jsfiddle.net/ve2huzxw/1/

In your case you would probably change the icon html content at the same time.