一条直线有两个端点确定,所以想要在地图上添加一条可展示的直线或折线,需要明确点位的具体经纬度,只需要调用高德api即可完成
1.先获取精准的点位坐标
可以通过高德的点击事件获取点击位置的坐标,例如:
this.map.on('click', function(e) {
console.log(e)
});
let poly_arr = [
[
[120.155818,36.859481],
[120.156534,36.858955],
],
[
[120.156422,36.860002],
[120.157115,36.859468],
],
[
[120.157014,36.860535],
[120.157716,36.860022],
],
[
[120.157614,36.861057],
[120.15833, 36.860561],
],
]
2.通过循环统一生成折线
for(let i = 0; i < poly_arr.length; i++){
var polyline = new AMap.Polyline({
path: poly_arr[i],
isOutline: true,
outlineColor: "#ffeeff",
borderWeight: 1,
strokeColor: "#ffffff",
strokeOpacity: 1,
strokeWeight: 6,
// 折线样式还支持 'dashed'
strokeStyle: "solid",
// strokeStyle是dashed时有效
strokeDasharray: [10, 5],
lineJoin: "round",
lineCap: "round",
zIndex: 50,
zooms:[16,20]
});
this.map.add(polyline);
}