Display InfoWindow (really, 'InfoBubble' subclass) beyond map container div

[Lloyd Force]

All,

(Using v3)

As designed, I'm sure, nothing under the control of the map, such as
an InfoWindow or marker, can display outside of the map canvas, which
is what one would normally want. However, in my case, I'm displaying a
popup when polygons are 'moused over'. Everything works great except
at the edges of the map. At the edge, the InfoBubble will be cut off.
'autoPan: true' makes the map feel sluggish so I can't use it
(basically, the user can fly the mouse over the map and when they stop
for a moment the popup will be displayed giving facts about the
polygon).

Is there any way around this? A nasty CSS hack, perhaps?

I'm trying to avoid having to switch the orientation of the InfoBubble
according to whether the edge is? If someone has implemented this
algorithm could she or he point me in the right direction? Perhaps
there is a flag in InfoBubble itself that will enable this behavior?
(I'm going through the source now myself to see if this will work).

Finally, I want to say thanks to all of the people that participate in
this group. I've been lurking on the forum for a few months, and it
has been really helpful to me. And a huge "thank you" to the
developers of geoxml3 (polys branch) and InfoBubble, as these projects
have been life-savers!

Regards,
Lloyd

[Chris Broadfoot]

Hi Lloyd,

This can be achieved using the MapCanvasProjection, which is available through the OverlayView class:

http://code.google.com/apis/maps/documentation/javascript/reference.html#OverlayView

It is a little cumbersome to work with, though - you won't be adding your overlay to any of the MapPanes.

Developers generally achieve this through what's known as a "DummyOverlayView". See this feature request for some background info:

http://code.google.com/p/gmaps-api-issues/issues/detail?id=2879

Let us know how you go.

Chris

--

http://twitter.com/broady

--
You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.
To post to this group, send email to google-map...@googlegroups.com.
To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.

[Lloyd Force]

Thanks for the response, Chris! I will definitely give this a shot, as
the constant panning into view is quite annoying. I will post a link
of what I achieve once the site is live (we hope in less than a week).

On an unrelated note, the InfoBubble class for some reason completely
clobbers IE 8 (possibly other versions, but all I have is IE 8). I am
treating the InfoBubble as a singleton, so I'm not sure why. As a wor
around, my accessor method for the InfoWindow - getInfoWindow() -
currently has an IE guard (using dojo, dojo.isIE <= 8) that returns a
google.maps.InfoWindow instead of InfoBubble. The result is a UI that
is a little sluggish (in IE only), but at least doesn't crash the
browser. Chrome / FF, on the other hand, are amazingly smooth (Chrome
is even more amazingly smooth). Leave it to IE to ruin a developer's
day!!!!!!

Regards,
Lloyd

On Sep 4, 9:51 pm, Chris Broadfoot <c...@google.com> wrote:
> Hi Lloyd,
>
> This can be achieved using the MapCanvasProjection, which is available

> through the OverlayView class:http://code.google.com/apis/maps/documentation/javascript/reference.h...

>
> It is a little cumbersome to work with, though - you won't be adding your
> overlay to any of the MapPanes.
>
> Developers generally achieve this through what's known as a
> "DummyOverlayView". See this feature request for some background info:http://code.google.com/p/gmaps-api-issues/issues/detail?id=2879
>
> Let us know how you go.
>
> Chris
>

> --http://twitter.com/broady

[Lloyd Force]

The application is finally live. I used the workaround mentioned in
the http://code.google.com/p/gmaps-api-issues/issues/detail?id=2879 to
create a fake InfoWindow.
I had to give up InfoBubble because 1) it crashed IE and 2) I could
not make it display outside of the map pane. Instead, I use the
MapProjection obtained from a hidden Overlay and use its
from...ToPixel method to position a DIV where I want to above the map
(as described in the issue linked to above).

You can see the result here: http://bit.ly/statsmap [
https://aroundthecornerhunger.drivetoendhunger.org/stats ]. Let me
know of any suggestions for making it better (and feel free to make a
donation).

Thanks for all your help, Google Maps JavaScript API v3 group
participants!

Regards,
Lloyd