如何使用AGM折线在标记移动时获取路径-Angular 6

时间:2018-09-05 10:18:23

标签: angular

当标记移动时,我能够在Google地图上获得一行。当标记获得新的位置点时,较早的路径将消失,而新路径将再次显示为一条直线,从而使较早的线消失。我想在标记获得新位置时显示所有路径。

目的是当标记移至新位置时保留所有路径。

这是我的代码:

<agm-map 
  #gm 
  [latitude]="lat" 
  [longitude]="lng" 
  [zoom]="zoom" 
  [disableDefaultUI]="false" 
  [zoomControl]="false" >
  <agm-marker 
    [iconUrl]="getMarkerColor(marker.status)" 
    *ngFor="let marker of markers; let i = index" 
    [latitude]="marker.location[0]" 
    [longitude]="marker.location[1]" 
    [label]="marker.label" 
    [markerDraggable]="marker.draggable" 
    (dragEnd)="markerDragEnd(m, $event)" 
    (markerClick)="gm.lastOpen?.close(); gm.lastOpen = infoWindow">
    <agm-info-window #infoWindow>
      <p><strong>Driver name: </strong>{{marker.driver}}</p>
      <p><strong>Source: </strong>{{marker.source}}</p>
      <p><strong>Destination: </strong>{{marker.destination}}</p>
      <p><strong>Speed: </strong>{{marker.speed}}</p>
    </agm-info-window>
  </agm-marker>
  <agm-polyline 
    *ngFor="let markerLines of markers;let i = index;" strokeColor="red">
    <agm-polyline-point 
      [latitude]="markerLines.location[0]" 
      [longitude]="markerLines.location[1]">
    </agm-polyline-point>
      <ng-container *ngIf="markers[i+1]">
        <agm-polyline-point 
          [latitude]="markers[i+1].location[0]" 
          [longitude]="markers[i+1].location[1]">
        </agm-polyline-point>
      </ng-container>
    </agm-polyline>
</agm-map>

0 个答案:

没有答案