Question

I have a balloon which pops up when clicking on a Marker. Sometimes the balloon exeeds the bounds of the map and is not fully shown.

I can’t center the map to the coordinates of the marker, because the ballon is sometimes too high and would still be outside the bounds. So I need an offset which moves the center of the map slightly down so the balloon is always nicly in the middle of my map.

The problem is that Google maps doesn’t work with pixels but with LatLng. Therefore I need a dynamically scalable function to keep the offset in every zoomlevel the same!

Answer 1

Alright, I found an algorithmic solution!

map.setCenter(
 new google.maps.LatLng(
  marker.getPosition().lat()+(X/Math.pow(2,map.getZoom())),
  marker.getPosition().lng()
 )
);

Each zoom level nearly doubles the LatLng which is shown on the map. So just find an X which is the perfect offset for you (in my case it was 128) and everything works great!

PS: The position of the marker is the same as the balloon.