3

我已经构建了一个 Google Maps API 工具集，允许用户在地图上绘制形状，给它们命名和记录区域。在完成每个形状后，系统会提示他们为其命名并设置一些其他选项，例如是否在地图上显示标签。

我想让用户在放置点时（即在绘制点时）右键单击并取消折线（或多边形）。

根据我在文档中阅读的内容，我应该能够检测到用户右键单击了地图，但我不确定如何取消他们正在绘制的叠加层，因为它不会被承诺地图尚未，这意味着我将无法将其称为对象。

有任何想法吗？

解决方案

感谢 Molle 博士的解决方案，如下所示：

    ...
    google.maps.event.addListener(_map, "rightclick", function(){
        InitialiseDrawingManager();
    });
}

function InitialiseDrawingManager(){
    if (_drawingManager != null)
        _drawingManager.setMap(null);

    _drawingManager = new google.maps.drawing.DrawingManager();
    _drawingManager.setMap(_map);

    UpdateOverlaySettings();
    ...
4

3 回答 3

8

虽然接受答案的代码有效，但它会引发错误，可能是由于未正确删除事件侦听器。

以下是更好的方法：

我使用一个变量cancelDrawingShape来检测在绘制内容时是否按下了 Escape 按钮。如果cancelDrawingShape设置为true，那么我将从地图中删除最后绘制的形状。

var cancelDrawingShape = false;

google.maps.event.addListener(drawingManager, 'overlaycomplete', function (e) {
    var lastDrawnShape = e.overlay;
    if (cancelDrawingShape) {
        cancelDrawingShape = false;
        lastDrawnShape.setMap(null); // Remove drawn but unwanted shape
        return;
    }

    // Else, do other stuff with lastDrawnShape
});

$(document).keydown(function (event) {
    if (event.keyCode === 27) { // Escape key pressed
        cancelDrawingShape = true;
        drawingManager.setDrawingMode(null); // To terminate the drawing, will result in autoclosing of the shape being drawn.
    }
});
于 2015-10-23T16:01:23.443 回答
5

（假设您使用google.maps.drawing.DrawingManager）

当前覆盖无法以任何方式访问。你可以做什么：

将-instancerightclick的-property设置为 null 并创建一个新的-instance。 mapDrawingManagerDrawingManager

这将删除当前编辑的覆盖（但不是已经完成的覆盖）

于 2013-08-27T13:38:32.627 回答
0

对于 Angular 7，这对我有用。

cancelDrawingShape: boolean = false; // declaration of variable
    @HostListener('document:keydown', ['$event']) onKeydownHandler(event: KeyboardEvent) {
        if (event.key === "Escape" || event.key === "Esc") {
          this.cancelDrawingShape = true;
          this.drawingManager.setDrawingMode(null); // To terminate the drawing, will result in autoclosing of the shape being drawn.
        }
      }

        google.maps.event.addListener(this.drawingManager,"polygoncomplete",
          polygon => {
            if(this.cancelDrawingShape){
              this.selectedShape = polygon;
              this.deleteSelectedShape();
              this.cancelDrawingShape = false;
              return false;
            }else{
               // else part
    }});
于 2020-01-08T07:48:29.833 回答