Question

I have polylines on my map and markers which should sit on the polylines.

The problem is the markers are shifted top left and they look like they are in some distance from polylines while they should be on top of them.

Anybody has an idea how to fix it? Thank you

Answer 1

OK

I found an answer in case anybody needs it.

I just used MarkerImage like that:

var image = new google.maps.MarkerImage(icon,
    // This marker is 20 pixels wide by 32 pixels tall.
    null, 
    // The origin for this image is 0,0.
    new google.maps.Point(0,0),
    // The anchor for this image is the base of the flagpole at 0,32.
    new google.maps.Point(7, 7)
);
var marker = new google.maps.Marker({
    position: new google.maps.LatLng(lat, lon),
    map: map,
    title: title,
    icon: image
});

where new google.maps.Point(7, 7) takes offset number in pixels.

Initial position 0,0 falls in the center bottom of the marker so I offset the image by half of it’s width and height.

Works perfectly now.