How can I center a small google maps on an info window as opposed to a point?

Question

I'm working on a small side bar google maps/twitter widget. Every few seconds the map pans to the next point associated with a tweet and displays the tweet in an info window.

The problem is that the info window sits in the corner of the map due to the map attempting to center on the point.

Img: http://yfrog.com/5yscreenshot20091029at102p

I'd like to be able to center the info window in the map pane if at all possible. Any thoughts?

Thanks

Answer 1

How are you opening the info window? (Some code would be helpful)

If you use openInfoWindowHtml, the map will move to fit the window as best as it can, not center on the marker.

Answer 2

The API tries to pan the map so that the infowindow is fully visible, but it appears to make unwarranted assumptions about things like infoWindowAnchor. However, I've never seen it perform as badly as that. I suspect that you might possibly have an incorrect iconAnchor value, but I can't tell by looking at an image.

You might try using different settings for infoWindowAnchor, even if they don't naturally fit with your icon image, and see how that changes things. (If it does work, you'll also need to keep checking to see if that's still the case in future API releases. It's possible that Google might fix the underlying problem which might cause such a workround to fail.)

If that doesn't work, what you could try is working out where the centre of the infowindow graphic is in relation to the marker, and centring the map there yourself. That involves converting the marker location to a pixel position, adding half the size of your largest infowindow graphic, and converting back from pixel position to GLatLng. Use map.fromLatLngToDivPixel() and map.fromDivPixelToLatLng(). Use {suppressMapPan:true} in your openInfoWindowHtml() call to tell the API not to tweak the position that you've set.

A link to your actual page would make it possible to suggest code.