我目前正在使用 https://github.com/SebastianM/angular2-google-maps附加了 Angular Google Maps 链接,我的要求是使用 agm-polyline 绘制动态线,当用户单击按钮时,它会在 map 上放置一个具有纬度和经度的点,现在我想绘制一条使用相同线路的路径: 我的样本是
app.html
<button (click)="add()">Add Line</button>
<agm-map [latitude]="lat" [longitude]="lng" [panControl]="true" [usePanning]="true" [rotateControl]="true">
<agm-marker [latitude]="lat" [longitude]="lng">
</agm-marker>
</agm-marker>
<agm-polyline *ngFor="let data of lines" [editable]="true">
<agm-polyline-point
[latitude]="data.lat"
[longitude]="data.lng">
</agm-polyline-point>
</agm-polyline>
</agm-map>
app.component.ts
add() {
console.log('on shape')
this.lines.push({lat: 51.79, lng: 7.8});//creates a point now want to add draw path
}
它现在使用这个点创建一个点,我想画一条线,任何帮助将不胜感激
最佳答案
您需要将 *ngFor="let data oflines"放置在 agm-polyline-point 内。像这样:-
<agm-polyline [editable]="true">
<agm-polyline-point *ngFor="let data of lines"
[latitude]="data.lat"
[longitude]="data.lng">
</agm-polyline-point>
</agm-polyline>
关于google-maps - 使用 angular2 谷歌地图添加动态线,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46425186/