1

http://jsfiddle.net/bor9zuhr/2/

On this Fiddle is an illustration of my problem. I have the navigation over the top of the map element. Now, when you click a marker, the map is being panned to the marker's coordinates, and the top of the info window most probably will not be readable when it is large enough.

What I want is to pan the map to a position above the marker, so that the info window falls lower, and will not be obscured by the navigation. Ideally, it would fall right in the middle of the visible area.

The problem is that when the map is zoomed in far, I need to pan it for a much smaller amount than if it were zoomed out far. And I can't seem to get the math right.

This is the part of the code that deals with the panning:

infowindow.open(map, marker);
var K = 0; // this should be something depending on the zoom level 
var lat = marker.getPosition().lat() + K;
var lng = marker.getPosition().lng();
var newCenter = new google.maps.LatLng(lat, lng);
map.panTo(newCenter);

1 Answer 1

2

You could call map.panBy at the end of your function.

From the docs:

Changes the center of the map by the given distance in pixels. If the distance is less than both the width and height of the map, the transition will be smoothly animated. Note that the map coordinate system increases from west to east (for x values) and north to south (for y values).

With panBy you don't have to think about zoom levels, you just pan by pixels.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.