基于 cesium 的 Property实现轨迹播放

 基于cesium实现轨迹播放,可以控制前进或者后退,暂停。

let Cesium = require("cesium/Cesium");

/**
 * 轨迹播放类封装
 * @param {options} Object
 * options包括cesium、viewer
 * @return {void}
 */

class TrackedPlayAnimate {
  constructor(viewer, cb) {
    this.viewer = viewer;
    this.cb = cb;
    // this.animateEntity = null;
  }

  startRoam (positions, speed) {
    let newPositions = positions.map(item => {
      return Cesium.Cartesian3.fromDegrees(item[0], item[1], 10000);
    });
    this.addRoamLine(newPositions, speed);
  }

  //添加漫游路线
  addRoamLine (positions, speed) {
    this.endRoam();

    let timeObj = this.getSiteTimes(positions, speed);

    let startTime = Cesium.JulianDate.fromDate(new Date());
    let stopTime = Cesium.JulianDate.addSeconds(
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Cesium是一个开源的WebGIS框架,可以用来构建地球空间数据可视化应用程序。在Cesium中,可以通过添加实体(Entity)来实现对物体的可视化,而实体中的属性(Property)可以控制物体的外观和行为。因此,可以利用Cesium的实体属性来实现飞行实时姿态仿真。 首先,需要创建一个Cesium的Viewer对象用于显示地球场景。然后,可以添加一个飞机模型的实体,并设置其初始位置、朝向和速度等属性。接着,可以通过添加一个定时器来更新飞机的位置和姿态,并将其实时显示在地球场景中。 具体实现步骤如下: 1. 创建一个Cesium的Viewer对象 ```javascript var viewer = new Cesium.Viewer('cesiumContainer'); ``` 2. 添加一个飞机模型的实体 ```javascript var planeEntity = viewer.entities.add({ name: 'Plane', position: Cesium.Cartesian3.fromDegrees(longitude, latitude, altitude), orientation: Cesium.Transforms.headingPitchRollQuaternion(position, Cesium.Math.toRadians(heading), Cesium.Math.toRadians(pitch), Cesium.Math.toRadians(roll)), model: { uri: 'path/to/aircraft.gltf', scale: 1.0 } }); ``` 其中,longitude、latitude和altitude分别表示飞机的经度、纬度和高度;heading、pitch和roll分别表示飞机的偏航角、俯仰角和滚转角;aircraft.gltf是飞机模型的3D模型文件。 3. 添加一个定时器来更新飞机的位置和姿态 ```javascript var speed = 100; // 飞机速度(米/秒) var lastTime = Date.now(); viewer.clock.onTick.addEventListener(function(clock) { var currentTime = Date.now(); var deltaTime = (currentTime - lastTime) / 1000; var distance = speed * deltaTime; // 根据飞机当前朝向计算移动方向 var heading = Cesium.Math.toRadians(planeEntity.orientation.getValue(clock).heading); var pitch = Cesium.Math.toRadians(planeEntity.orientation.getValue(clock).pitch); var roll = Cesium.Math.toRadians(planeEntity.orientation.getValue(clock).roll); var direction = new Cesium.Cartesian3(Math.sin(heading) * Math.cos(pitch), Math.cos(heading) * Math.cos(pitch), -Math.sin(pitch)); // 计算新的飞机位置 var position = Cesium.Cartesian3.fromDegrees(longitude, latitude, altitude); position = Cesium.Cartesian3.add(position, Cesium.Cartesian3.multiplyByScalar(direction, distance), position); // 计算新的飞机姿态 heading += roll * deltaTime / 2; pitch += Math.sin(heading) * roll * deltaTime / 2; roll -= Math.sin(pitch) * roll * deltaTime / 2; var orientation = Cesium.Transforms.headingPitchRollQuaternion(position, heading, pitch, roll); // 更新飞机实体的位置和姿态 planeEntity.position = position; planeEntity.orientation = orientation; lastTime = currentTime; }); ``` 其中,speed表示飞机的速度,lastTime表示上一次更新飞机位置和姿态的时间,deltaTime表示当前时间和上一次更新时间的时间差,distance表示飞机在这段时间内移动的距离。接下来,根据飞机当前的朝向计算移动方向,然后计算新的飞机位置和姿态。最后,更新飞机实体的位置和姿态。 通过以上步骤,就可以实现飞行实时姿态仿真,让飞机在地球场景中飞行。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

易航动效

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值