Google maps api 3 使用自定义按钮在地图上绘制一次后，无法自动停止/结束绘制模式

我正在使用以下代码，并使用自定义按钮（不是谷歌地图内置的绘图工具栏）将矩形绘图添加到地图中，该按钮正在添加形状，但在完成绘图后不会自动停止/结束绘图模式

我试着加上

google.maps.event.addListener(map.drawingManager, "overlaycomplete", function(event){                   
    map.drawingManager.setDrawingMode(null);
}); 

但仍然没有停止绘图模式

<button onclick="drawRec();">Draw Rectangle</button>

var drawingManager = new google.maps.drawing.DrawingManager();
function drawRec() {
    drawingManager.setOptions({
        drawingMode : google.maps.drawing.OverlayType.RECTANGLE,
        drawingControl : false,
        drawingControlOptions : {
            position : google.maps.ControlPosition.TOP_CENTER,
            drawingModes : [ google.maps.drawing.OverlayType.RECTANGLE ]
        },
        rectangleOptions : {
            strokeColor : '#6c6c6c',
            strokeWeight : 3.5,
            fillColor : '#926239',
            fillOpacity : 0.6,
            editable: true,
          draggable: true
        }   
});
drawingManager.setMap(map);

}
google.maps.event.addListener(map.drawingManager, "overlaycomplete", function(event){                   
    map.drawingManager.setDrawingMode(null);
});  
google.maps.event.addDomListener(window, 'load');

绘制矩形
var drawingManager=new google.maps.drawing.drawingManager（）；
函数drawRec（）{
drawingManager.setOptions({
drawingMode:google.maps.drawing.OverlayType.RECTANGLE，
drawingControl:错误，
drawingControlOptions：{
位置：google.maps.ControlPosition.TOP_CENTER，
drawingModes:[google.maps.drawing.OverlayType.RECTANGLE]
},
矩形选项：{
strokeColor:“#6c6c”，
冲程重量：3.5，
填充颜色：'#926239'，
填充不透明度：0.6，
是的，
德拉格布尔：是的
}   
});
drawingManager.setMap（map）；
}
google.maps.event.addListener（map.drawingManager，“OverlyComplete”，函数（事件）{
map.drawingManager.setDrawingMode（null）；
});  
google.maps.event.addDomListener（窗口“加载”）；

问题的副本：，您只需检查矩形是否已存在，然后再开始新的矩形：

google.maps.event.addListener(drawingManager, 'overlaycomplete', function(overlay) {
  // keep reference to the overlay
  rectangle = overlay;
  drawingManager.setOptions({
    drawingMode: null,
    drawingControl: false
  });
});

然后在

drawRec

中，检查它是否已经存在，以及它是否从映射中删除它或阻止代码绘制另一个

function drawRec() {
  //Setting options for the Drawing Tool. In our case, enabling Polygon shape.
  if (!!rectangle && !!rectangle.overlay && !!rectangle.overlay.setMap) {
    rectangle.overlay.setMap(null);
  }

代码片段：

var矩形；
var映射；
风险提取经理；
函数initMap（）{
map=new google.maps.map（document.getElementById（'map'）{
中心：{
拉脱维亚：44.5452，
液化天然气：-78.5389
},
缩放：9
});
drawingManager=新建google.maps.drawing.drawingManager（）；
google.maps.event.addListener（drawingManager，'overlaycomplete'，函数（overlay）{
矩形=叠加；
drawingManager.setOptions({
drawingMode:null，
drawingControl:错误
});
});
}
google.maps.event.addDomListener（窗口'load'，initMap）；
函数drawRec（）{
//设置绘图工具的选项。在我们的例子中，启用多边形形状。
if（！！rectangle&&！！rectangle.overlay&&！！rectangle.overlay.setMap）{
矩形.overlay.setMap（null）；
}
drawingManager.setOptions({
drawingMode:google.maps.drawing.OverlayType.RECTANGLE，
drawingControl:错误，
drawingControlOptions：{
位置：google.maps.ControlPosition.TOP_CENTER，
drawingModes:[google.maps.drawing.OverlayType.RECTANGLE]
},
矩形选项：{
strokeColor:“#6c6c”，
冲程重量：3.5，
填充颜色：'#926239'，
填充不透明度：0.6，
是的，
德拉格布尔：是的
}
});
drawingManager.setMap（map）；
}

html，
身体，
#地图{
身高：100%；
身高：100%；
保证金：0；
填充：0；
}

绘制矩形

可能再次复制Hi，但正如您在帖子中看到的，我没有使用任何自定义按钮进行绘图，而是使用内置工具栏。您不认为

使用自定义按钮

就足以解释这一点：-）我在帖子

中也提到过（不是谷歌地图内置绘图工具栏）

因此我不知道如何进一步解释目前我必须单击

停止绘图

按钮停止另一个绘图，但如何在完成绘图后完全停止而不明确单击该按钮