刚开始是一条绿色的线

想要匀速走过的轨迹线变成红色

但是轨迹线动态加载时一直在闪烁

js

// 全屏地图路线图并动画移动
var ii = 0
var timer = ''
// 坐标集合
let points = [{
    longitude: 106.5538,
    latitude: 29.50401,
  },
  {
    longitude: 106.553907,
    latitude: 29.499472,
  },
  {
    longitude: 106.556354,
    latitude: 29.487089,
  },
  {
    longitude: 106.555667,
    latitude: 29.485053,
  },
  {
    longitude: 106.553285,
    latitude: 29.476311,
  },
  {
    longitude: 106.550131,
    latitude: 29.473864,
  },
  {
    longitude: 106.540174,
    latitude: 29.468932,
  },
  {
    longitude: 106.536183,
    latitude: 29.469941,
  },
  {
    longitude: 106.531312,
    latitude: 29.469212,
  },
  {
    longitude: 106.526527,
    latitude: 29.471043,
  },
  {
    longitude: 106.524317,
    latitude: 29.47207,
  },
  {
    longitude: 106.524253,
    latitude: 29.471939,
  },
// 轨迹点  . . . 
];
Page({
  data: {
    markers: [], // 标记点集合
    polyline: [], // 坐标点集合
    satellite: false, // 是否开启卫星图
    i: 0
  },
  onReady: function () {
    this.mapCtx = wx.createMapContext('map'); // 创建 map 上下文 MapContext 对象
  },
  start() {
    let that = this;


    clearInterval(timer)
    ii = 0
    this.setData({
      polyline: [{
        points: points,
        color: "#14C556",
        width: 5
      }],
      // markers:markers,
      longitude: 106.587891,
      latitude: 29.544862,
    })
    timer = setInterval(() => {
      ii = ++ii
      if (ii == points.length - 1) clearInterval(timer)
      that.translateMarker()
    }, 500);
  },
  onLoad: function () {
    let that = this;
    this.start()
  },
  // 平移marker，带动画
  translateMarker: function (markers) {
    let that = this;
    var passedpoint = [];
    if (ii > 0) {
      for (var pointsindex = 0; pointsindex <= ii; pointsindex++) {
        passedpoint.push(points[pointsindex]);
      }
      let {
        polyline
      } = that.data
      polyline.push({
        points: passedpoint,
        color: "#FF0000DD",
        width: 3,
        arrowLine: true
      });
      that.setData({
        polyline
      })
    }
  },
})

wxml

<button bindtap="start">开始</button>
<view class="container">
  <map id="map" longitude="{{longitude}}" latitude="{{latitude}}" scale="12" markers="{{markers}}" polyline="{{polyline}}" enable-satellite="{{satellite}}" show-location style="width: 100%; height: 100vh;"></map>