I have notice that my leaflet markers are "not staying put" on a given lat/lon. When I zoom in on the map, the marker moves to adjust and take the correct position. When I zoom out, it goes to a different position. It'snot static on the position. How can I fix this ?
There is nothing special about my marker. below is how I built it
var LeafIcon = L.Icon.extend({
options: {
iconSize: [12, 15],
shadowSize: [30, 40],
iconAnchor: [11, 70],
shadowAnchor: [2, 42],
popupAnchor: [-3, -40]
}
});
var map_icon = new LeafIcon({iconUrl: 'icon_marker.png'});
var marker;
marker = L.marker([my_lat, my_lon], {icon: map_icon});
marker.addTo(map);
marker.bindPopup("My markers' popup");
The symptom you describe is typical of incorrect iconAnchor setting.
It is strange that your iconAnchor is outside iconSize.
To make sure your settings are properly defined, you could add an extra marker with default icon at the same lat/lng coordinates, and see if your custom icon tip is at the same position.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With