Markers and zIndex

1,254 views
Skip to first unread message

sgiddings

unread,
Mar 16, 2011, 1:44:53 PM3/16/11
to google-map...@googlegroups.com
Since markers are now rendered via canvas, are requested zIndex values respected ?
It is not my impression.

bratliff

unread,
Mar 16, 2011, 3:05:01 PM3/16/11
to Google Maps JavaScript API v3
According to Ben Appleton, the markers are pre-sorted in zIndex order
prior to painting. He did not say what was being done in the event
listeners to resolve overlapping markers.

I suspect individual marker event listeners are dispatched from a
common event listener for the CANVAS tile with the "this" argument set
accordingly. I suspect it works backwards. I suspect it does not
continue beyond the first hit.

Chris Broadfoot

unread,
Mar 16, 2011, 6:29:53 PM3/16/11
to google-map...@googlegroups.com, sgiddings
Why is this not your impression? Do you have a sample page that demonstrates that this is not the case?

It would be helpful to see exactly what you are trying to achieve.

Chris

sgiddings

unread,
Mar 17, 2011, 4:59:32 AM3/17/11
to google-map...@googlegroups.com, sgiddings
Hi Chris,

Ok, I will need to knock up an example.
Here is the scenario,
1. Insert a marker at a position specifying a zIndex of 1.
2. Once this marker has been drawn - important step - insert another marker slightly higher (ensuring overlap for validation).  It is important that the second marker be higher than the first as the default behaviour would be to display the first in front of the second.  Give this marker a zIndex of 10 when creating it.

Note here that I specify the zIndex via the MarkerOptions object.

The result, that I see at least, is that the second marker is displayed behind the first.

Why am I wanting to do this ?
For my use, the first marker represents the location of the user and the second marker represents a POI.  If the POI is behind the location marker, the user has difficulty in clicking on it or getting the correct tooltip.

Simon

Chris Broadfoot

unread,
Mar 17, 2011, 8:24:04 AM3/17/11
to google-map...@googlegroups.com, sgiddings
On Thu, Mar 17, 2011 at 7:59 PM, sgiddings <mr.s.g...@gmail.com> wrote:
The result, that I see at least, is that the second marker is displayed behind the first.

I tried to reproduce this and can't. Please whip up a sample page! :)

Gary Little

unread,
Mar 18, 2011, 12:43:37 AM3/18/11
to Google Maps JavaScript API v3
Chris,

I too have been noticing unexpected problems in z ordering with V3.4,
not sure if it's related to this problem, but it might be.

In my case, I'm attempting to set the z-index of an OverlayView object
based on the current z-index of an associated Marker so I can order
them properly relative to one another (usually to force the
OverlayView on top). Sometimes, though, the OverlayView object appears
below the marker. I think this happens sometimes because the order in
which objects are drawn on the map varies (or perhaps is random).

When the map is zoomed, for example, this will affect the z-index of
the DIV holding the Marker (because it's set to the vertical position
if no explicit z-index has been set for the Marker). However, the
OverlayView will not detect the change if the OverlayView is drawn
*before* the Marker, so the relative ordering of the two objects may
not work out as expected. (If the Marker were drawn first, there would
be no problem.)

To solve this problem, it would be beneficial if one could listen for
an event that is fired when a Marker is drawn or redrawn (doesn't
exist at the moment) or if the name of the Marker draw method were
known.

Any suggestions?

Gary

On Mar 17, 5:24 am, Chris Broadfoot <c...@google.com> wrote:

Chris Broadfoot

unread,
Mar 18, 2011, 2:48:02 AM3/18/11
to google-map...@googlegroups.com, Gary Little
Hi Gary,

Because Markers are now rendered in Canvas tiles, a group of markers may exist inside one DOM element. This makes it infeasible to order your own DOM elements with in the overlayImage pane. So, the first step is to specify optimized:false when instantiating your Markers.

Doing so isn't a solution in itself. I take it you want to have a DOM element match or closely relate to a particular Marker's z-index. The API does not expose internal z-indexes, so the key here is to set z-indexes yourself. This allows you to deterministically order your own DOM elements amongst API Markers' DOM elements.

When setting z-indexes yourself, you could employ a similar strategy to the API. Setting z-index based on Mercator y-value and/or latitude is a good starting point.

Hope that helps,
Chris

sgiddings

unread,
Mar 18, 2011, 9:21:45 AM3/18/11
to google-map...@googlegroups.com, sgiddings
Hi Chris,

Ok, sample whipped up !
http://www.pumaproductions.fr/google/markerzindex.htm

From further tests, it would appear related to the use of the 'draggable' property.

This leads me to the following question : would changing the draggable property dynamically (through setDraggable) affect the display ?

Simon

Gary Little

unread,
Mar 18, 2011, 12:42:50 PM3/18/11
to Google Maps JavaScript API v3
Chris:

Setting optimized: false seems to have solved my problem since I was
already doing everything else you suggested. Thanks.

Now I wish I could set optimized: true but for that I need an official
way to access the internal z-indexes of the marker.

(This is part of my work on MarkerWithLabel
http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/
, by the way.)


Simon: you may want to try setting optimized: false to see if it helps
your problem. With Safari/Mac, I also see that the marker with the
higher explicitly-set zIndex appears in the background.


Gary
Message has been deleted
Message has been deleted

Gary Little

unread,
Mar 18, 2011, 2:34:49 PM3/18/11
to Google Maps JavaScript API v3
Chris:

After further analysis... optimized: false doesn't work reliably with
Safari/Mac (entire markers sometimes go missing). Seems to be OK with
every other Mac browser. Will start a new thread to discuss.

Gary

On Mar 18, 9:42 am, Gary Little <g...@luxcentral.com> wrote:
> Chris:
>
> Setting optimized: false seems to have solved my problem since I was
> already doing everything else you suggested. Thanks.
>
> Now I wish I could set optimized: true but for that I need an official
> way to access the internal z-indexes of the marker.
>
> (This is part of my work on MarkerWithLabelhttp://google-maps-utility-library-v3.googlecode.com/svn/tags/markerw...

Gary Little

unread,
Mar 18, 2011, 2:45:25 PM3/18/11
to Google Maps JavaScript API v3
Message has been deleted

Gary Little

unread,
Mar 18, 2011, 10:51:46 PM3/18/11
to Google Maps JavaScript API v3
Simon:

I tried your sample and I also observe the problem you're describing.

I added an optimized: false parameter to each marker and everything
now works as expected!

Definitely a bug -- zindex of draggable markers isn't behaving as
expected when optimized is true (the new default).

Gary

On Mar 18, 6:21 am, sgiddings <mr.s.giddi...@gmail.com> wrote:
> Hi Chris,
>
> Ok, sample whipped up !http://www.pumaproductions.fr/google/markerzindex.htm

sgiddings

unread,
Mar 19, 2011, 9:46:46 AM3/19/11
to Google Maps JavaScript API v3
Chris,

After Gary's remarks, do we need to open a bug report here ?

Simon

Chris Broadfoot

unread,
Mar 21, 2011, 3:53:18 AM3/21/11
to google-map...@googlegroups.com, sgiddings
(originally posted to the wrong thread :)

Unfortunately it is not feasible to put draggable markers below canvas markers.

So, unless you want all your draggable markers above canvas markers, it's necessary to specify optimized: false when creating your non-draggable markers.

Hope this helps,
Chris


sgiddings

unread,
Mar 21, 2011, 4:30:08 AM3/21/11
to google-map...@googlegroups.com, sgiddings
Hi Chris,

Thanks for the clarification.
One further - related - question : will dynamically changing the zIndex (via setZIndex) cause a redraw, visually raising or lowering the marker ?

Simon

Chris Broadfoot

unread,
Mar 21, 2011, 8:43:22 PM3/21/11
to google-map...@googlegroups.com, sgiddings
On Mon, Mar 21, 2011 at 7:30 PM, sgiddings <mr.s.g...@gmail.com> wrote:
One further - related - question : will dynamically changing the zIndex (via setZIndex) cause a redraw, visually raising or lowering the marker ?

Yes - did you try it?

--
http://twitter.com/broady
Reply all
Reply to author
Forward
0 new messages