vue高德地图 根据点跳着，或者平滑的进行轨迹回放

最近做了一个需求是：根据高德地图，从后台接口获取经纬度数据，然后进行轨迹回放，从一个点跳到下一个点上，且底部有播放轨迹回放的按钮，时间轴跟着轨迹回放一起动，右边数据也跟着一起变化。 查阅了多方资料，在不懈努力的情况下，终于完成了次需求，再次给大家分享下：

做的效果图如下：

首先得安装高德地图的插件，再次就不用说了

template的写法模板如下：

<template>
  <div class="map-outbox">
    <!--地图容器-->

    <div id="container">
      <div class="playTraceVedioInfo">
        <div style="width:8%;display:flex;padding:7px 0px">
          <img src="@/image/trace/noReplay.png">
          <img v-if="playImg" src="@/image/trace/play.png" @click="playTraceInfo">
          <img v-else src="@/image/trace/stopTrace.png" @click="stopTraceInfo">
        </div>
        <span>{
  {changeTime}}/</span>
        <span style="margin-right:10px">{
  {totalTime}}</span>
        <el-progress :percentage="progress" style="width:70%"></el-progress>
        <el-dropdown @command="handleCommand">
          <span class="el-dropdown-link">
            {
  {speed}}
            <i class="el-icon-arrow-down el-icon--right"></i>
          </span>
          <el-dropdown-menu slot="dropdown" placeme