views:

498

answers:

2

I am having problems with centering the map using the panTo() method - as well as making the directions (from/to) to work like tabs.

Here is my code:

http://dpaste.com/76251/

+2  A: 

I'm not too sure what you want the map to do, but there is one big problem with your panTo() function. You placed it inside of the function markerClickHandler() which is called when the markers are created, which happens on page load. So you are calling panTo() three times when the page is loaded.

If you want it to be called when the marker is clicked, place it in the function which is returned by markerClickHandler().

Keep in mind, however, that the movement will likely be interrupted by the opening of the Info Window (which moves the map). The best solution I can think of to that problem is to move the map after the window has opened. You can pass onOpenFn as a GInfoWindowOptions parameter:

map.openInfoWindowTabsHtml(marker.getLatLng(), tabs, {
    onOpenFn: function() {
     map.panTo(marker.getLatLng());
    }
});

Note: for some reason, this only worked if I called openInfoWindowTabsHtml() on the map object instead of the marker - I don't know why.

Chris B
Thank you, I will give it a try. Just to clarify things I would like to pan the map when a user clicks on any of the items in the side navigation.
Eeyore
No problem - let me know if you have any other issues.
Chris B
+1  A: 

The example snippet you're linking to is no longer available, but assuming from the answer by Chris, I'm assuming you want to center the marker whose info window was opened. I had the same problem and solved it like this:

GEvent.addListener(marker, 'infowindowopen', function() {
    map.panTo(marker.getLatLng());
});
nikc