Leaflet Marker not static on position

Question

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");

Answer 1

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.