Javascript 从google maps drawingManager V3中删除多边形

我有一个用户可编辑的谷歌地图，用户可以使用绘图管理器在地图上绘制覆盖多边形。这工作正常，控制台记录我需要的lat lngs。但是，我需要添加一个按钮，将清除多边形的地图，以便他们可以再次绘制，如果犯了错误。我的实现代码粘贴如下：

geocoder = new google.maps.Geocoder();
      var latlng = new google.maps.LatLng(<?php echo $latitude ?>, <?php echo $longitude ?>);
       var myOptions = {
         zoom: <?php echo $zoomlevel ?>,
         center: latlng,
         mapTypeId: google.maps.MapTypeId.ROADMAP
       };
       var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

       marker = new google.maps.Marker({
         map:map,
         draggable:true,
         animation: google.maps.Animation.DROP,
         position: latlng
       })

       pos = marker.position;
       //alert(pos);
       document.getElementById("gpsite-surgery-latitude").value = pos.lat();
       document.getElementById("gpsite-surgery-longitude").value = pos.lng();

       google.maps.event.addListener(marker, "dragend", function() {
               var myLatLng = marker.latLng;

               pos = marker.position;
               //alert(pos);
               document.getElementById("gpsite-surgery-latitude").value = pos.lat();
               document.getElementById("gpsite-surgery-longitude").value = pos.lng();
       })

       google.maps.event.addListener(map, 'zoom_changed', function() {
          document.getElementById("gpsite-surgery-zoomlevel").value = map.getZoom();
       });

       var drawingManager = new google.maps.drawing.DrawingManager({
        drawingMode: google.maps.drawing.OverlayType.MARKER,
        drawingControl: true,
        drawingControlOptions: {
            position: google.maps.ControlPosition.TOP_CENTER,
            drawingModes: [google.maps.drawing.OverlayType.POLYGON]
        },
        polygonOptions: {
            fillColor: '#ffff00',
            fillOpacity: 0.4,
            strokeWeight: 3,
            clickable: true,
            zIndex: 1,
            editable: false
        }
       });


       google.maps.event.addListener(drawingManager, 'polygoncomplete', function (polygon) {
            var coordinates = (polygon.getPath().getArray());
            console.log(coordinates);
        });

       drawingManager.setMap(map);

   });

geocoder=new google.maps.geocoder（）；
var latlng=新的google.maps.latlng（，）；
变量myOptions={
缩放：，
中心：拉特林，
mapTypeId:google.maps.mapTypeId.ROADMAP
};
var map=new google.maps.map（document.getElementById（“map_canvas”），myOptions）；
marker=新的google.maps.marker({
地图：地图，
真的，
动画：google.maps.animation.DROP，
职位：latlng
})
pos=标记位置；
//警报（pos）；
document.getElementById（“gpsite纬度”）.value=pos.lat（）；
document.getElementById（“gpsite”）.value=pos.lng（）；
google.maps.event.addListener（标记“dragend”，function（））{
var myLatLng=marker.latLng；
pos=标记位置；
//警报（pos）；
document.getElementById（“gpsite纬度”）.value=pos.lat（）；
document.getElementById（“gpsite”）.value=pos.lng（）；
})
google.maps.event.addListener（映射'zoom_changed'，函数（）{
document.getElementById（“gpsite zoomlevel”）.value=map.getZoom（）；
});
var drawingManager=new google.maps.drawing.drawingManager({
drawingMode:google.maps.drawing.OverlyType.MARKER，
drawingControl：对，
drawingControlOptions：{
位置：google.maps.ControlPosition.TOP_CENTER，
drawingModes:[google.maps.drawing.OverlayType.POLYGON]
},
多克隆选择：{
填充颜色：'#ffff00'，
填充不透明度：0.4，
冲程重量：3，
可点击：正确，
zIndex:1，
可编辑：false
}
});
google.maps.event.addListener（drawingManager，'polygoncomplete'，函数（多边形）{
变量坐标=（polygon.getPath（）.getArray（））；
控制台日志（坐标）；
});
drawingManager.setMap（map）；
});

---

地图上还有一个标记，您可以忽略它。

您需要在全局上下文中引用多边形。然后在按钮调用polygon.setMap（null）的click handler函数中（其中polygon是多边形的全局引用，无法从您发布的不完整代码片段中判断它是否是全局的）

检查此代码，它听起来与您所说的一模一样，是一个删除形状的按钮

编辑：上面的链接已断开，但我能够找到该代码

---

对于单个多边形覆盖，我执行了以下操作：

var _myPolygon; // global variable to store the polygon instance

google.maps.event.addListener(drawingManager, 'overlaycomplete', function(e) {
    _myPolygon = e.overlay;
});

$('#delete-button').on('click', function() {
    _myPolygon.setMap(null);
});

---

一切都在我的文件里。准备好了。我不知道调用多边形的单击事件处理程序的语法。谷歌的文档是不完整的，因为它在圆上做了很多工作，但在多边形上做得不多。我也意识到我不能全局引用多边形，因为正如前面提到的，它是用户使用drawingManager输入的plygon。似乎没有办法让用户删除它

var _myPolygon; // global variable to store the polygon instance

google.maps.event.addListener(drawingManager, 'overlaycomplete', function(e) {
    _myPolygon = e.overlay;
});

$('#delete-button').on('click', function() {
    _myPolygon.setMap(null);
});