javascript - Placing a MapLabel on top of a Polygon in Google Maps V3

Question

I'm trying to place a MapLabel on top of a Polygon in Google Maps V3. I've tried to set the MapLabel zIndex to 2 and the Polygon zIndex to 1 without any luck. Isn't this possible since the Polygon doesn't really follow zIndex?

I've created a jsFiddle for you guys to check out: http://jsfiddle.net/7wLWe/1/

Solution: In maplabel.js change:

mapPane.appendChild(canvas);

to:

floatPane.appendChild(canvas);

The reason is because floatPane is above all map layers (pane 6)

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

Answer 1

This is probably a late find.. but hope someone would find this useful.

If you don't want to use floatPane (John's Solution) as this will be always on top of everything, and want to give a custom zIndex.. Edit the maplabel.js. Add the following line just before the end of MapLabel.prototype.onAdd = function() {

if (canvas.parentNode != null) {
    canvas.parentNode.style.zIndex = style.zIndex;
}

Now you can pass zIndex while creating a maplabel:

var mapLabel = new MapLabel({
    text: "abc",
    position: center,
    map: map,
    fontSize: 8,
    align: 'left',
    zIndex: 15
});