title: Dynamic Google Maps Polygon - How can I set to editable when clicked
body: <p>I've been successfully created dynamic polygons on google maps given the sets of latlngs.</p>
  
  <pre><code>  &lt;script&gt;
    map = new google.maps.Map(document.getElementById('map'), {
      center: {lat: 25.774252, lng: -80.190262},
      zoom: 2
    });
  
    var latlngs = [
      [
        {lat:25.774252,lng:-80.190262},
        {lat:18.466465,lng:-66.118292},
        {lat:32.321384,lng:-64.757370},
        {lat:25.774252,lng:-80.190262},
      ],
      [
        {lat:59.677361,lng:-2.469846},
        {lat:59.299717,lng:-6.314917},
        {lat:57.877247,lng:-9.314917},
        {lat:54.428078,lng:-11.638861},
        {lat:51.784554,lng:-11.702241}
      ]
    ];
    for(var y=0; y&lt;latlngs.length; y++) {
  
      var sample=[];
  
      for(var z=0; z&lt;latlngs[y].length; z++) {
        sample.push(new google.maps.LatLng(parseFloat(latlngs[y][z].lat), parseFloat(latlngs[y][z].lng)));
      }
  
      var boundary = new google.maps.Polygon({
        paths: sample,
        strokeColor: 'black',
        strokeWeight: 2,
        fillColor: 'black',
        fillOpacity: 0.2,
        zIndex: 1,
        content: 'AREA '+y
      });
      boundary.setMap(map);
  
      var infoWindow = new google.maps.InfoWindow;
      boundary.addListener('click', function(event){
        boundary.setEditable(true); // &lt;- HERE IS THE PROBLEM
        infoWindow.setContent(this.content);
        infoWindow.setPosition(event.latLng);
        infoWindow.open(map);
      });
    }
  &lt;/script&gt;
  </code></pre>
  
  <p>The problem of the above codes is that, only the last polygon will set as editable even if I've clicked the first one.</p>
  
  <p>What should be the code so that, only the polygon that was clicked will set to editable?</p>