[GIS] Adding click event to every polygon on map in leaflet to use map.fitBounds()

javascriptleaflet

Here is my code. But it's showing only last polygon which is iterated from array. (For binding polygon I am using array)

var polygon, i;
for (i = 0; i <= latlngs.length; i++)
{
    if (i < 2) {
        polygon = L.polygon(latlngs[i], { color: 'green' }).addTo(mymap);
    }
    else {
        polygon = L.polygon(latlngs[i], { color: 'red' }).addTo(mymap);
    }
    polygon.on('click', function (e) {
     mymap.fitBounds(polygon.getBounds());
    });       
}

Best Answer

var polygon, i;
for (i = 0; i < latlngs.length; i++) {

    if (i < 2) {
        polygon = L.polygon(latlngs[i][0], { color: 'green', id : latlngs[i][1]}).addTo(mymap);
    }
    else {
        polygon = L.polygon(latlngs[i], { color: 'red', id: latlngs[i][1] }).addTo(mymap);
    }

    polygon.on('click', function () {
        //mymap.fitBounds(polygon.getBounds());
        mymap.fitBounds(this.getBounds());

        getChilds(this.options.id);
    });
Related Question