Google maps API: Marker image positioning
I have changed the image that I use for a marker
on Google maps. The new image is much wider than the old one and I have noticed that the marker is aligned with the lat
and lng
so that the marker rests with it's horizontal midpoint over the lat
and lng
. This is not what I want, I want to have the lat
and lng
aligned with the markers left hand side - I want to offset the marker
from the def开发者_JS百科ault position by about 80px to the right.
Try this on for size.
var markerImage = new google.maps.MarkerImage('/img/icon/here.png',
new google.maps.Size(80, 80), //size
new google.maps.Point(0, 0), //origin point
new google.maps.Point(0, 80)); // offset point
marker[stamp] = new google.maps.Marker({
position: loc, // loc is a variable with my lngLat object
title: params.name,
map: window.gMaps[params.map],
icon: markerImage
});
You want the 'anchor' property of MarkerImage. Note that the origin property comes before anchor in the constructor call. If you're not using sprites, you can just send null for the optional parameters.
If your marker is 80x60 and you want the anchor in the middle of the left side, create it like this:
var markerImage = new google.maps.MarkerImage('customIcon.png', new google.maps.Size(80, 60), null, new google.maps.Point(0, 30));
See also Google's example.
精彩评论