z-index

446 views
Skip to first unread message

aus_ed

unread,
Jun 5, 2008, 4:46:39 AM6/5/08
to KML Developer Support - Google Earth Browser Plugin
Hi, I'm just starting with this new great app. My first problem to
with deploying Earth on my web site is that I'm using screen overlays
for extra info. If Earth map option is selected it is shown on top of
everything.

I tried to use z-index:100000; for a <div> that I want to be on top
but still GE is "on top" :-)

Any suggestions much appreciated.

Cheers

Arek

aus_ed

unread,
Jun 5, 2008, 7:19:34 AM6/5/08
to KML Developer Support - Google Earth Browser Plugin


And I noticed, when scrolling a page in FF(v2.0.0.14) the Earth frame
"jumps out" of it's position and page gets scrumbled. Possible bug...

Robert S

unread,
Jun 6, 2008, 12:15:43 AM6/6/08
to KML Developer Support - Google Earth Browser Plugin
I'm having the same z-index problem and would also like to know if
there's a supported fix for this. Thanks.

Dilated

unread,
Jun 6, 2008, 2:14:28 AM6/6/08
to KML Developer Support - Google Earth Browser Plugin
I also came across this problem, but at least they've given us the DIV
balloons, where you can create a balloon overtop the map and drop a
DIV element in it.

For example,
var balloon = ge.createHtmlDivBalloon("");
var div = document.createElement("div");
div.innerHTML = "Blah blah html html blah blah";
balloon.setContentDiv(div);
ge.setBalloon(balloon);

explained in some detail here:
http://code.google.com/apis/earth/documentation/introduction.html#info

If anyone has any info on ways to change the styles of these balloons
that'd be great!
I'd be handy to change the background color, maybe get rid of the 'x'
button, make the window stay open despite clicks on the map etc etc
lots of potential=D

Robert S

unread,
Jun 6, 2008, 7:33:41 AM6/6/08
to KML Developer Support - Google Earth Browser Plugin
On Jun 6, 2:14 am, Dilated wrote:
> If anyone has any info on ways to change the styles of these balloons
> that'd be great!
> I'd be handy to change the background color, maybe get rid of the 'x'
> button, make the window stay open despite clicks on the map etc etc
> lots of potential=D

I have a hack for referencing the balloon div directly. See this
thread and scroll down a bit:
http://groups.google.com/group/google-earth-browser-plugin/browse_thread/thread/25bdc4c370dd14e4?hl=en

I think you can probably do a better job of styling the balloons using
the KML balloon style element (can't remember the name). See the KML
reference.

The "X" seems to be outside the div that's overlaid onto the balloon
and I doubt you can disable it. Not sure if you can somehow "trap"
mouse events and stop them from reaching the default event handlers or
anything. I haven't tried that but I get the feeling that you probably
can't.

(And please let me know if you know of any tricks to fix my window
positioning problem. My current idea works in FF but not in MSIE, big
surprise.... If this z-index problem were fixed then it wouldn't be an
issue.)

Robert S

unread,
Jun 6, 2008, 8:02:21 AM6/6/08
to KML Developer Support - Google Earth Browser Plugin
Through some fooling around I just discovered something. If I overlay
a div into the middle of the plugin's box, it isn't visible UNTIL I
cause a balloon to display. When this happens, if the balloon happens
to cover the region with my div in it, my div suddenly becomes
visible.

So, the plugin is somehow not allowing elements to render over the
plugin's region unless they're inside a currently displayed balloon.

I don't know how plugins work but perhaps you normally can't render
anything over a plugin's region unless the plugin creates a "hole" in
it's region to let the elements "show through"? If so, it might be
nice if there were a way to manually create these "holes" or something.

aus_ed

unread,
Jun 6, 2008, 7:56:09 PM6/6/08
to KML Developer Support - Google Earth Browser Plugin
Yes, I noticed this effect as well. My overlay div shows through only
on map type selector buttons. So, there must be a way to control
display order of div elements (google does it with the buttons etc).
Question is, is this only for areas/holes that google defined or can
it work for any div?

I'm using my primitive version of lightbox effect to add more contnt
to the map (for example like here: http://www.aus-emaps.com/emergency_incidents.php)
but I can't do it with Earth. Maxing info window/baloon within the map
area is not an option...

Maybe there is a way to "attach" a div (ie the "hole") to the map div
(as childNode or something?) to cover the entire map (ie same way
buttons are attached) so it can allow "see-through"?


Robert S

unread,
Jun 7, 2008, 4:50:42 PM6/7/08
to KML Developer Support - Google Earth Browser Plugin
On Jun 6, 7:56 pm, aus_ed wrote:
> Yes, I noticed this effect as well. My overlay div shows through only
> on map type selector buttons. So, there must be a way to control
> display order of div elements (google does it with the buttons etc).

What do you mean by map type selector buttons?

I believe google maps is implemented using browser primitives rather
than some plugin, so essentially google maps is just constructed from
normal divs anyway. Therefore there's no problem because you're just
placing divs on top of other divs. I think the problem comes in
because google earth isn't constructed from HTML/DOM primitives, but
native code that draws directly into a region on the page.

> I'm using my primitive version of lightbox effect to add more contnt
> to the map (for example like here:http://www.aus-emaps.com/emergency_incidents.php)
> but I can't do it with Earth. Maxing info window/baloon within the map
> area is not an option...

I think I see what you're trying to do. I wonder if it's possible to
set display:none on the plugin div and then show your info box? If it
were somehow possible to copy the bitmap of the plugin div and place
it on the p of the same size, show that, then hide the plugin div, you
might be able to get a similar effect. I'm not enough of a javascript
whiz to know if there's some standard way to snapshot the bitmap of a
page region

BTW:

Event: Snow Storm
Area: Caribean Area
Country: Jamaica

> Maybe there is a way to "attach" a div (ie the "hole") to the map div
> (as childNode or something?) to cover the entire map (ie same way
> buttons are attached) so it can allow "see-through"?

Well, using Firebug you can see that the balloon div is simply
absolutely positioned in the window. It's added as the last child of
the <body> element.

I suspect that they've implemented Google Earth in FF at least as a
"transparent windowless plugin":

http://developer.mozilla.org/en/docs/Gecko_Plugin_API_Reference:Drawing_and_Event_Handling#Windowless_Plug-ins

"You can create transparent plug-ins. In this case, the browser draws
the part of the page that exists behind the plug-in. The windowless
plug-in draws only the parts of itself that are opaque. This way, the
plug-in can draw an irregularly shaped area, such as a figure, or text
over the existing background.“

So I suspect "holes" (such as the one in the balloon) are created by
invalidating the whole plugin region then just "not drawing" that
region with the hole. It also sounds like it's not possible for the
browser to render anything over a plugin.

Feature request! I want a way to create arbitrary transparent
rectangles in the plugin!

Robert S

unread,
Jun 7, 2008, 5:16:47 PM6/7/08
to KML Developer Support - Google Earth Browser Plugin
BTW, looks like this kind of thing has been an issue with Flash for a
while, usually manifesting itself as "my DHTML menus won't display
over flash movies":

http://www.communitymx.com/content/article.cfm?cid=E5141

The problem is that flash will set you set the window mode and
transparency, and it looks like google earth won't.

If I can believe this page then it sounds like windowless opaque
plugins should allow "z-indexing" elements over the plugin region, so
maybe Google Earth is actually a windowed plugin (has it's own OS
window as a child of the browser window) which just gets an oddly-
shaped window when balloons are displayed? This would make sense for
performance reasons.

aus_ed

unread,
Jun 7, 2008, 8:32:48 PM6/7/08
to KML Developer Support - Google Earth Browser Plugin
Hi Robert,

re: What do you mean by map type selector buttons?

I added Earth as another mapType to my existing Google map. In this
option buttons Map | Satellite | Hybrid | Terrain are displayed on top
of Earth plug in. Transparent overlay shows only on those buttons -
same as with the baloon.

re: I believe google maps is implemented using browser primitives
rather
than some plugin, so essentially google maps is just constructed from
normal divs anyway.

Yes, you are correct. So it is possible to attach divs. Unfortunately
any divs addached are not showing in Earth option, which is another
issue! (hopefully, as GE plug-in gets developed it will be enabled)


re: I think I see what you're trying to do. I wonder if it's possible
to
set display:none on the plugin div and then show your info box? If it
were somehow possible to copy the bitmap of the plugin div and place
it on the p of the same size, show that, then hide the plugin div,
you
might be able to get a similar effect. I'm not enough of a javascript
whiz to know if there's some standard way to snapshot the bitmap of a
page region

It's an idea worth exploring, thanks! I will experiment. I also though
about maxing a ballon with no content to cover the entire Earth map...
but wouldn't it be easier if Earth map just worked as the other
maps:-)

re: Jamaica Snow Storm...:-) information is from a reputable source
via geoRSS ... the whole web serivces thingy is furstrating at times,
I know all about it! I'm experimenting with many formats in geo domain
and they all suffer from reliability and quality issues.


Interesting read re: Flash etc. It's another challegne as I want to
try Flash version of GM as well...

I hope ManoM will have a chance to comment on the whole issue at the
earliest opportunity.

Cheers!

Robert S

unread,
Jun 8, 2008, 10:20:02 AM6/8/08
to KML Developer Support - Google Earth Browser Plugin
On Jun 7, 8:32 pm, aus_ed wrote:
> I added Earth as another mapType to my existing Google map.

Oh that... I see what you mean.


> I hope ManoM will have a chance to comment on the whole issue at the
> earliest opportunity.

I'm not sure if Google ever comments on implementation details or the
possibility of new features, but I could be wrong....

aus_ed

unread,
Jun 8, 2008, 7:34:22 PM6/8/08
to KML Developer Support - Google Earth Browser Plugin
Google Dev Team is quite active and helpful on Map-API group. I hope
the same tradition will be continued on this forum as well :-)

ManoM

unread,
Jun 8, 2008, 9:51:32 PM6/8/08
to KML Developer Support - Google Earth Browser Plugin
Of course! I usually don't comment if it seems like y'all have
something in hand. I was traveling to Japan for a couple of days, so
it took me awhile to get to this thread.

Z Ordering is something we're aware of. And as someone pointed out, we
don't usually comment on when and if and how bugs will be fixed, but
we are aware of the problem and are looking into it. If I come up with
any workarounds you haven't touched on, I'll be sure to let you know.

Mano

aus_ed

unread,
Jun 9, 2008, 2:42:24 AM6/9/08
to KML Developer Support - Google Earth Browser Plugin
Thanks Mano, I din't mean to rush with a respone! After all most of
the discussion was during a weekend, and it's an extended weekend here
in Aus (Queen's Brithday). I'm looking forward to a solution, in due
course of course! I know you guys are working hard so we all can have
our wishes grandted (114 upgrades since GM v2 release + new 3D map is
an impressive pace of development!). Much appeciated.

Arek
Reply all
Reply to author
Forward
0 new messages