vue人员轨迹_Vue项目（vuecli3.0搭建）集成高德地图实现路线轨迹绘制

先看最后实现的效果图

高德地图api文档

使用

1、在index.html里面引入高德地图js文件

2、引入之后我们就直接可以在vue组件里面使用了

创建initMap方法，在mounted钩子函数中调用

mounted(){

this.initMap()

},

initMap(){

let that = this

this.map = new AMap.Map('track-map', {

zoom:11,//级别

center: [116.397428, 39.90923],//中心点坐标

resizeEnable: true,

zoom: 12,

});

// 插件

AMap.plugin(['AMap.ToolBar', 'AMap.Scale'], function () {

that.map.addControl(new AMap.ToolBar())

that.map.addControl(new AMap.Scale())

})

// marker标记

this.marker = new AMap.Marker({

position: null

})

this.map.add(this.marker);

// 绘制折线

this.path = new AMap.Polyline({

path: