高德地图轨迹显示、滑块调节进度、点击轨迹直接跳转到轨迹点、倍速播放功能实现-准备工作

滑块使用iview滑块,可根据需要自己更改,安装iview

 npm install view-ui-plus --save

高德地图使用vue-amap

npm install @vuemap/vue-amap@legacy --save

在main.js中引入

import 'view-ui-plus/dist/styles/viewuiplus.css'
import VueAMap from '@vuemap/vue-amap';
import '@vuemap/vue-amap/dist/style.css'
Vue.use(VueAMap)

VueAMap.initAMapApiLoader({
    key: '高德key',
    plugins: ['AMap.Autocomplete', 'AMap.PlaceSearch', 'AMap.Scale', 'AMap.OverView',
        'AMap.ToolBar', 'AMap.MapType', 'AMap.PolyEditor', 'AMap.CircleEditor', 'AMap.MarkerClusterer', 'AMap.MoveAnimation'],
    v: '2.0'
})
window._AMapSecurityConfig = {
    securityJsCode: "高德securityJsCode",
};