Google Maps custom label x and y position
Another option I don't see mentioned here. You can set a CSS class for the label, then set the position using CSS. First, add className to the label:
label: {
text: saved_label,
color: 'black',
fontSize: '12px',
className: 'marker-position',
}
And for the CSS:
.marker-position {
bottom: 6px;
left: 0;
position: relative;
}
Google Maps API v3 doesn't let you set MarkerLabel
position, there're no x
and y
options.
The doc also says:
If you are using it with a custom marker, you can reposition it with the labelOrigin property in the Icon class.
As I can see you're using custom marker so maybe this is the way to go for you.
Alternatively, have a look at MarkerWithLabel. Is an extension to the default Marker
object with more options available. Small demo: http://jsfiddle.net/LLd4drvx/239/.
"labelOrigin" ended up having to to be passed in since I am using a custom marker.
numberMarkerImg = {
url: '../images/mobile/map-marker.png',
size: new google.maps.Size(32, 38),
scaledSize: new google.maps.Size(32, 38),
labelOrigin: new google.maps.Point(9, 9)
};