Angular AGM 在标记点击时绘制多边形

Question

我正在使用 angular agm，需要在点击标记后绘制一个多边形。

<agm-map [latitude]="latitude"
         [longitude]="longitude"
         [zoom]="zoom">

  <agm-marker *ngFor="let item of items; let i = index"
              [latitude]="item.Latitud"
              [longitude]="item.Longitud"
              (markerClick)="drawPolygon($event)">

  </agm-marker>

</agm-map>

这是 drawPolygon 方法的相关部分：

event.data.add({
  geometry: new google.maps.Data.Polygon([
    zona])
})

但是，我收到错误消息：无法读取未定义的属性 'add'。。

在该方法中绘制多边形有任何想法或解决方法吗？

Answer 1

不使用命令式命令，而是以 Angular/AGM 方式添加多边形；

<agm-map [latitude]="latitude"
         [longitude]="longitude"
         [zoom]="zoom">

  <agm-marker *ngFor="let item of items; let i = index"
              [latitude]="item.Latitud"
              [longitude]="item.Longitud"
              (markerClick)="drawPolygon($event)">

  </agm-marker>

  <agm-polygon *ngFor="let polygon of polygons">
  </agm-polygon>

</agm-map>

drawPolygon() {
  this.polygons.push( newPolygonData)
}

Angular AGM 在标记点击时绘制多边形

Angular AGM draw polygon on marker click

google-maps

angular

agm