zIndex no cambia el orden z de los círculos con la API de Google Maps

Pardon my noobishness, but, although I've seen this issue discussed, I haven't found an answer. I am trying to draw concentric circles on a Google Map using the API v3, making each clickable as on a bullseye target, but always the largest one ends up on top, which means it is the only clickable one.

The following uses an array called "subjects" that consists of increasing radii and various fillcolors.

for (i=0;i<subjects.length;i++) {
 radi = subjects[i][0];
 fillcolr = subjects[i][1];
 zindx = subjects.length - i;
 newcircle = new google.maps.Circle({
        radius: radi, 
        center: centerPoint, 
        strokeWidth: 1,  
        fillOpacity: 1.0,
        fillColor: fillcolr,
        zIndex: zindx
    // display it
    // make outer circle clickable
    google.maps.event.addListener(newcircle, 'click', function() {

The circles are there, the zIndex is set, but the biggest circle is always on top. I have tried setting zIndex on a pass afterwards, boosting each zIndex by 10000, reversing the order in which I create the circles, not setting the zIndex explicitly, etc. I'm sure I am missing something obvious (see the aforementioned noobishness), but I can't figure out what it is. TIA for any pointers...

preguntado el 08 de enero de 11 a las 17:01

Not an answer, but I'm having the same issue. Aquí's a full, minimal example (github gist) exhibiting the unexpected behavior, and aquí está a live example. Anyone know what's up? -

1 Respuestas

Try this for every shape you need:


respondido 11 nov., 13:15

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.