Google 映射 event.addListener 对象未定义

Google maps event.addListener object undefined

我在 google 地图多边形中使用双击事件注册了一个 eventListener,但是如果我将调试器放入将在 dblclick 上执行的 de 函数中,我无法捕捉到单击了哪个多边形,对象 'newPolygon' 未定义。

问题是我有一个多边形数组,我需要知道点击了什么

  var newPolygon = drawPolygon(map, p.cordenadas, true, false, false, "#FF0000", 0.35, "#FF0000", 0.8, 2);

  var listener = google.maps.event.addListener(newPolygon, 'dblclick', function (e) {
            //newPolygon = undefined
            debugger;
        });

绘制多边形函数:

function drawPolygon(map, paths, clickable, draggable, editable, fillColor, fillOpacity, strokeColor, strokeOpacity, strokeWeight) 
{
polygon = new google.maps.Polygon({
    paths: paths,
    strokeColor: strokeColor,
    strokeOpacity: strokeOpacity,
    strokeWeight: strokeWeight,
    fillColor: fillColor,
    fillOpacity: fillOpacity,
    editable: editable,
    clickable: clickable,
    draggable: draggable,
    map: map,
});
var firstCoord = paths[0];
map.setCenter(firstCoord);
return polygon;
}

点击侦听器函数中对多边形的引用是this

var listener = google.maps.event.addListener(newPolygon, 'dblclick', function (e) {
        for (var i=0; i<this.getPaths().getAt(0).getLength();i++) {
        console.log(this.getPaths().getAt(0).getAt(i).toUrlValue());
        }
        debugger;
    });

代码片段:

var geocoder;
var map;

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var triangleCoords = [{
    lat: 25.774,
    lng: -80.190
  }, {
    lat: 18.466,
    lng: -66.118
  }, {
    lat: 32.321,
    lng: -64.757
  }, {
    lat: 25.774,
    lng: -80.190
  }];
  var newPolygon = drawPolygon(map, triangleCoords, true, false, false, "#FF0000", 0.35, "#FF0000", 0.8, 2);

  var listener = google.maps.event.addListener(newPolygon, 'dblclick', function(e) {
    for (var i = 0; i < this.getPaths().getAt(0).getLength(); i++) {
      console.log(this.getPaths().getAt(0).getAt(i).toUrlValue());
    }
    debugger;
  });
}
google.maps.event.addDomListener(window, "load", initialize);

function drawPolygon(map, paths, clickable, draggable, editable, fillColor, fillOpacity, strokeColor, strokeOpacity, strokeWeight) {
  polygon = new google.maps.Polygon({
    paths: paths,
    strokeColor: strokeColor,
    strokeOpacity: strokeOpacity,
    strokeWeight: strokeWeight,
    fillColor: fillColor,
    fillOpacity: fillOpacity,
    editable: editable,
    clickable: clickable,
    draggable: draggable,
    map: map,
  });
  var firstCoord = paths[0];
  map.setCenter(firstCoord);
  return polygon;
}
html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>