Setting zIndex to get label to display above marker

[Malcolm]

My question relates to getting labels to display above markers by setting the zIndex property. This is discussed in Marc Ridey's imformative blog (http://blog.mridey.com/2009/09/label-overlay-example-for-google-maps.html) on this topic.

(I've included my test code - which is essentially Marc's example below). I want to modify this code so that the label displays above the marker. My production application will have multiple markers but they will not be draggable. So it would seem all I need to do is get the label to display above the marker (on a mouseover event). However, I tried adding/changing the code to set the zIndex property as discussed in Marc's blog but an not sure what and where to do this. Would someone be kind enough to indicate what and where I need to change this code to get the label ontop of the marker?

Also, one other related question that is getting me "cratching my head" concerns the span cssText properties. I tried changing the border to be 2px. When I do this the left side of the border does not show. I tried a variety of style property settings - more padding etc. and can get the label to initally display with more space around it (inside the border) but when I move it the label redraws and the space to the left is truncated. Any explanation as to why and how to get some additional space around (or to the left and right of the text) would be greatly appreciated.

Thanks.

 

P.S. Code is in attached file.

 

 

 

[Gary Little]

Malcolm,

Here's a piece of code derived from from my MarkerWithLabel class that
shows what you have to do:

function setLabelZIndex( labeldiv, marker ) {
var zAdjust = 1; // or -1 if you want the label in the background
if (typeof marker.getZIndex() === "undefined") {
labeldiv.style.zIndex = parseInt(labeldiv.style.top, 10) +
zAdjust;
} else {
labeldiv.style.zIndex = marker.getZIndex() + zAdjust;
}
};

If the marker's z-index is not explicitly set, you need to set the z-
index of the label DIV to one higher than its vertical position. If
the marker does have a z-index, set it to one higher than the marker's
z-index.

Gary

On Dec 1, 8:14 am, Malcolm <MalcolmFaulk...@hotmail.com> wrote:
> My question relates to getting labels to display above markers by
> setting the zIndex property. This is discussed in Marc Ridey's
> imformative blog

> (http://blog.mridey.com/2009/09/label-overlay-example-for-google-maps....)

> on this topic.
>
> (I've included my test code - which is essentially Marc's example
> below). I want to modify this code so that the label displays above the
> marker. My production application will have multiple markers but they
> will not be draggable. So it would seem all I need to do is get the
> label to display above the marker (on a mouseover event). However, I
> tried adding/changing the code to set the zIndex property as discussed
> in Marc's blog but an not sure what and where to do this. Would someone
> be kind enough to indicate what and where I need to change this code to
> get the label ontop of the marker?
>
> Also, one other related question that is getting me "cratching my head"
> concerns the span cssText properties. I tried changing the border to be
> 2px. When I do this the left side of the border does not show. I tried
> a variety of style property settings - more padding etc. and can get
> the label to initally display with more space around it (inside the
> border) but when I move it the label redraws and the space to the left
> is truncated. Any explanation as to why and how to get some additional
> space around (or to the left and right of the text) would be greatly
> appreciated.
>
> Thanks.
>
> P.S. Code is in attached file.
>

>  C:Google MapsMarkerLabel.htm
> 2KViewDownload