Google map: Add click listener to each polygon Google map: Add click listener to each polygon javascript javascript

Google map: Add click listener to each polygon


It's the normal behavior.There is two solutions that I can think of :

1) I am sure you can find back the polygon from the context (I didn't test it):

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

2) You could also use some 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 polygonArrayfor (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);}


Move the code block inside the for-loop.

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

OR

You add this to for-loop,

p.addListener('click', clickSelection);

and do this

function clickSelection(){alert("Clicked");}