Mapa Google: Dodaj detektor kliknięcia do każdego wielokąta

Question

Pracuję nad aplikacją internetową. Mam mapę google, gdzie dodaję wielokąty z tablicy. Przeszukuję tę tablicę i dodajemy wielokątów do mapy. Muszę również dodać detektor zdarzeń do wielokąta kliknięciem i zaalarmować pozycję wielokąta

to co robię wszystko

map = new google.maps.Map(document.getElementById('map_canvas'), 
    mapOptions); 
//Loop on the polygonArray 
for (var i = 0; i < polygonArray.length; i++) { 
    //Add the polygon 
    var p = new google.maps.Polygon({ 
     paths: polygonArray[i], 
     strokeWeight: 0, 
     fillColor: '#FF0000', 
     fillOpacity: 0.6, 
     indexID: i 
    }); 
    p.setMap(map); 

    //Add the click listener 
    google.maps.event.addListener(p, 'click', function (event) { 
     //alert the index of the polygon 
     alert(p.indexID); 
    }); 
} 

Problem

Wielokąty rysowania poprawnie . Problem polega jednak na tym, że gdy próbuję kliknąć wielokąt, zawsze pokazuje on ostatni indeks. to tak, jakby kliknął tylko ostatni dodany wielokąt. Myślę, że kiedy dodaję nowego słuchacza, zastępuje on stary. Jak mogę dodać detektor dla każdego dodanego wielokąta, aby ostrzec właściwy indeks?

Dzięki

Answer 1

To normalne zachowanie. Istnieją dwa rozwiązania, które mogę myśleć:

1) Jestem pewien, że można znaleźć z powrotem wielokąt z kontekstu (nie testowałem go):

google.maps.event.addListener(polygon, 'click', function (event) { 
    alert(this.indexID); 
}); 

2) Można też korzystania z niektórych closures:

var addListenersOnPolygon = function(polygon) { 
    google.maps.event.addListener(polygon, 'click', function (event) { 
    alert(polygon.indexID); 
    }); 
} 

map = new google.maps.Map(document.getElementById('map_canvas'), 
    mapOptions); 
//Loop on the polygonArray 
for (var i = 0; i < polygonArray.length; i++) { 
    //Add the polygon 
    var p = new google.maps.Polygon({ 
     paths: polygonArray[i], 
     strokeWeight: 0, 
     fillColor: '#FF0000', 
     fillOpacity: 0.6, 
     indexID: i 
    }); 
    p.setMap(map); 
    addListenersOnPolygon(p); 
}