How to center map on marker and open marker's InfoWindow in one method

Question

I'm using Google Map APIv2. On my webpage I've a sidebar containing a list of markers with onclick event executing showDetails method, that looks like:

GMarker.prototype.showDetails=function() { map.panTo(this.getLatLng()); this.openInfoWindowHtml(this.details); };

The problem is that i cannot both panTo and openInfoWindowHtml in one method, it pans but won't open tooltip and when i change method to:

GMarker.prototype.showDetails=function() { this.openInfoWindowHtml(this.details); map.panTo(this.getLatLng()); }; it opens tooltip but won't center map to the marker's anchor coordinates. Even using wait function doesn't solve my problem. What am I doing wrong?

Answer 1

You need to first do an addListener to wait until the map is done moving with the 'moveend' event. Then in your event handler call removeListener on the listener that you created so that the event handler only runs once. After that in the event handler open your info window.

Answer 2

the openInfoWindowHtml method should trigger a panto to put the infowindow in the viewport

ie

marker is outside the viewport and you trigger the infowindow on that marker - the map should pan to that location +/- so that the infowindow is centered in the viewport