javascript - 获取当前在 Google Map API V3 上的叠加形状列表

Question

我正在使用 API V3 的 Google map 绘图管理器。 google.maps.drawing.DrawingManager

我让用户在 map 上绘制多个圆形叠加层。然后，当他们点击“保存”按钮时，我需要能够获取所有圈子的属性，并最终用它来实现我的服务器端魔法。

如何使用 Javascript 获取圆的列表，作为对象或数组...等等？

下面是我创建 DrawingManager 并将 Circle 工具添加到控件的代码。我或多或少都在关注这个 https://developers.google.com/maps/documentation/javascript/reference#DrawingManager

if (drawingManager == null) {
    drawingManager = new google.maps.drawing.DrawingManager({
        drawingMode: google.maps.drawing.OverlayType.CIRCLE,
        drawingControl: false,
        drawingControlOptions: {
            position: google.maps.ControlPosition.TOP_CENTER,
            drawingModes: [google.maps.drawing.OverlayType.CIRCLE]
        },
        circleOptions: {
            fillColor: '#FF0000',
            fillOpacity: 0.35,
            strokeWeight: 5,
            clickable: false,
            draggable: true,
            zIndex: 1,
            editable: true
        }
    });
}

Answer 1

有一个事件overlayComplete这将在您完成绘制覆盖图后发送(在您的情况下它是圆圈)。您可以处理它并将新创建的对象添加到数据结构中，例如到数组，您可以使用它来存储对象并将它们发送到服务器。尝试这样的事情:

  //After creating 'drawingManager' object in if block 
  google.maps.event.addListener(drawingManager, 'overlaycomplete', function(event) {
      if (event.type == google.maps.drawing.OverlayType.CIRCLE) {
         //Add 'event.overlay', which is Circle, to array
      }
  });