手机录屏地址：http://p.cecen.vip/aa.mp4

首页点击“开始记录轨迹”按钮，程序开始每5秒记录一次位置，并将经纬度通过api.ApiInsert接口写入数据库，主要代码如下：

      wx.getLocation({
        type: 'gcj02',    //type: wgs84/gcj02
        success (res) {
          util.request(api.ApiInsert, {
              latitude: res.latitude,
              longitude: res.longitude,
              speed: res.speed,
              accuracy: res.accuracy
          },"POST").then(function (data) {
              if (data.statusCode != 200) {
                console.log("轨迹记录失败： " + data.message);
              }
          });
                }
             })

点击“停止记录轨迹”按钮时，终止以上动作。

在轨迹页面中选择一个要回放的日期后进行初始化数据，主要代码如下：
    util.request(api.ApiGetLocation, {
      date: this.data.date
    }, 'GET').then(res => {
      if (res.statusCode == 200) {
        this.setData({
          location: { latitude: res.data[0].latitude, longitude: res.data[0].longitude },
          markers: [{
            id: 1,
            latitude: res.data[0].latitude,
            longitude: res.data[0].longitude,
            width: 16,
            height: 20,
            iconPath: 'https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/car.png',
          }],
          polyline: [{
            points: res.data,
            color: '#3875FF',
            width: 6
          }]
        });

      }
      })

初始化完数据后，当用然点确定时进行模拟回放，主要代码如下：

    const mapCtx = wx.createMapContext('map', this);
    mapCtx.moveAlong({
      markerId: 1,
      path: this.data.polyline[0].points,   //移动路径的坐标串
      duration: 10000,    //平滑移动的时间
      autoRotate: true    //车头按行驶方向自动旋转，默认true
    });

前端map如下：

      <map

        class="map"
        id="map"
        latitude="{{location.latitude}}"
        longitude="{{location.longitude}}"
        markers="{{markers}}"
        polyline="{{polyline}}"
        scale="{{scale}}"
        enable-zoom="{{true}}"
        enable-scroll="{{true}}"
        showScale="{{true}}"
        showCompass="{{true}}"
      >
      </map>

效果未达到实际要求，展示出来的路线，有些路段歪歪扭扭的，与实际不符。