cesium模型轨迹移动

1.把时间轴和动画面板打开
2.数据集合

 data() {
    return {
      list: [
        {
          lon: 116.405419,
          lat: 39.918034,
          height: 0,
          // sjtime: "2022-02-22T08:25:57.000+0800",
          time: 1656047671018,
        },
        {
          lon: 116.2821,
          lat: 39.918145,
          height: 0,
          // sjtime: "2022-02-22T08:26:27.000+0800",
          time: 1656047771018,
        },
        {
          lon: 115.497402,
          lat: 39.344641,
          height: 0,
          // sjtime: "2022-02-22T08:26:57.000+0800",
          time: 1656047871018,
        },
      ],
    };
  },

3.逻辑代码

// 添加轨迹
    addLine(val,color){
      val.forEach((item) =>{
        cViewer.entities.add({
          polyline: {
          //位置
            positions: Cesium.Cartesian3.fromDegrees(item.lon, item.lat, item.height),  
            //线宽
            width: 5, 
            //路线颜色 
            material: new Cesium.Color.fromCssColorString(color),
            //是否贴地
            clampToGround: true,
          },
        });
      })  
    },
    
    // 位置信息
    computeFlight(list) {
      var property = new Cesium.SampledPositionProperty();
      // 取样位置 相当于一个集合
      for (var z = 0; z < list.length; z++) {
        var item = list[z];
        var thisTime = Cesium.JulianDate.fromDate(new Date(item.time));
        var position = Cesium.Cartesian3.fromDegrees(
          list[z].lon,
          list[z].lat,
          list[z].height
        );

        // 添加每一个链接点的信息，到达的时间以及坐标位置
        property.addSample(thisTime, position);
      }
      return property;
    },
    
	// 添加模型动画
    modelAnimate(list,modelGltf){
	  //添加路线
	  let color = 'red';
	  this.addLine(list,color);
	  
      // 开始时间
      var date = new Date(list[0].time);
      var start = Cesium.JulianDate.fromDate(date); //获取第一个点的时间

      // 设置始时钟始时间
      cViewer.clock.startTime = start.clone();
      // 设置时钟当前时间
      cViewer.clock.currentTime = start.clone();
      // 时间速率，数字越大时间过的越快
      cViewer.clock.multiplier = 10;

      let property = this.computeFlight(list);
	  
	  // 设置始终停止时间
      var times = property._property._times;
      var stop = times[times.length - 1];   
      cViewer.clock.stopTime = stop.clone();

      // 时间轴
      cViewer.timeline.zoomTo(start, stop);
      // 循环执行,即为2，到达终止时间，重新从起点时间开始
      cViewer.clock.clockRange = Cesium.ClockRange.LOOP_STOP;

      let planeModel = cViewer.entities.add({
        // 和时间轴关联
        availability: new Cesium.TimeIntervalCollection([
          new Cesium.TimeInterval({
            start: start,
            stop: stop,
          }),
        ]),
        position: property,
        // 根据所提供的速度计算模型的朝向
        orientation: new Cesium.VelocityOrientationProperty(property),
        // 模型数据
        model: {
          uri: modelGltf,
          scale: 1,
          minimumPixelSize: 90,
        },
      });
    }

4.调用

   this.modelAnimate(this.list,'文件');

根据这两位大佬写的代码
https://blog.csdn.net/A873054267/article/details/86231494
https://blog.csdn.net/qq_42129143/article/details/125449327