Search code examples
google-mapsgoogle-maps-api-3google-maps-static-api

Google Static Maps api v2 custom marker offset wrong without shadow


I'm having trouble with the offset of custom icons in the Google static maps API. Notice the difference in offset for the javascript api and the static maps api. The custom icon is created exactly as described here Google API documentation

How can I fix this offset so that the icon is positioned on it's correct coordinates? (I use the javascript API in an admin zone to position the marker for presentation with the static API.)

The problem is the zoom, which I want to be different, but how can I position it more accurate with a different zoom?

This is the Static maps API with incorrect positioning:

Google maps api V3![][1]

This is the Static maps API with shadow:

With shadow

This is the Javascript API v3 with correct positioning:

Google static map api v2

edit: So if I add the shadow again the position is correct, but Is there a way to correct it without the shadow?

I want to have the marker centered AND with correct positioning.


Solution

  • Because you are not using a shadow, the API has assumed that the marker's "anchor point" is in its centre, not the point at the bottom.

    The centre of the static map icon in your first illustration is at the same location as the point of the marker in the second image.

    Because the marker is a fixed size, the pointer will point to a different location with different zooms.

    To fix, remove the shadow:false descriptor from your custom icon.