如果拖动多边形,则在AGM angular4中获取LatLng

时间:2018-01-05 05:07:24

标签: angular angular-google-maps

我正在使用AGM以多边形的形式获取所选区域的LatLng。现在我绘制多边形我成功地根据多边形获得LatLng点。但是当我从多边形的任何一点将指针拖到多边形时,它的LatLng点不会改变。我想在拖动时改变它们。

Component.html: -

<agm-map [latitude]="options.lat" [longitude]="options.lng" (mapClick)="onMapClick($event)">
   <agm-polygon [paths]="paths" [editable]=options.editable  [visible]="options.visible" [draggable]=options.draggable [fillColor]=options.fillColor>
   </agm-polygon>
</agm-map>

Component.ts: -

paths : Array<LatLngLiteral> = [];

options : any = {
  lat          : 33.5362475,
  lng          : -111.9267386,
  zoom         : 10,
  fillColor    : '#DC143C',
  draggable    : true,
  editable     : true,
  visible      : true
};

public onMapClick(evt) {
   let clickCrd = { lat: evt.coords.lat, lng: evt.coords.lng };
   this.paths.push(clickCrd);
   let newArray = Array<LatLngLiteral>();
   this.paths.forEach((item) => {
     newArray.push(item);
  });
  this.paths = newArray;
}

这里是stackblitz

请告诉我怎么可能?

1 个答案:

答案 0 :(得分:0)

您可以使用AgmPolygon指令的内置方法

以下是一些可以帮助您实现此目标的方法:

  1. polyDrag
  2. polyDragStart
  3. polyDragEnd