vue使用高德地图实现订单历史轨迹

本来是想用vue-amap ，最后发现没有那样的可以参考的。于是转战高德原生地图。效果图在最后面。（一打开弹框，就能看到车子动态运行的轨迹，一个子就开始跑起来了）（本例子经过线上环境的检验，可直接复用）

一、引入高德地图

1.在index.html中引入高德地图

2.在vue.config.js 中或者 webpack.base.conf.js 中引入（不同的项目可能有不一样的文件）

module.exports = {
  configureWebpack: {
    externals: {
      'AMap': 'AMap' // 高德地图配置
    }
  }
}

二、上代码

 
         
            查看历史轨迹
          
        

 
    
      

    

官方实例参考：

https://lbs.amap.com/api/javascript-api/example/marker/replaying-historical-running-data/?sug_index=6

三、效果图