Cesium.Ion.defaultAccessToken =
        "token";
      const viewer = new Cesium.Viewer("cesiumContainer", {
        shouldAnimate: true,
      });
     const start=Cesium.JulianDate.fromDate(new Date(2018,11,12,15));
     //从 JavaScript 日期创建一个新实例。
     const totalSeconds=10;
     const stop=Cesium.JulianDate.addSeconds(
  start,totalSeconds,new Cesium.JulianDate());
  //将提供的秒数添加到提供的日期实例。
viewer.clock.startTime=start.clone();
//复制此实例。
viewer.clock.stopTime=stop.clone();
viewer.clock.currentTime=start.clone();
viewer.clock.clockRange=Cesium.ClockRange.LOOP_STOP;
//时间轴的运作方式 循环or播完暂停
viewer.timeline.zoomTo(start,stop);
   
const position=new Cesium.SampledPositionProperty();
//采样 位置 特性
const startPosition=new Cesium.Cartesian3(
  -2379556.799372864,
  -4665528.205030263,
  3628013.106599678
);
//3D笛卡尔坐标系点
const endPosition = new Cesium.Cartesian3(
  -2379603.7074103747,
  -4665623.48990283,
  3627860.82704567
);
const velocityVectorProperty=new Cesium.VelocityVectorProperty(
  position,false
);
//速度  矢量 特性
//用于计算速度的位置属性
//是否对结算的速度矢量进行归一化
const velocityVector=new Cesium.Cartesian3();
const wheelAngleProperty=new Cesium.SampledProperty(Number);
//一个 Property ,
//其值在给定时间内根据提供的样本集和指定的插值算法和度数进行插值
let wheelAngle=0;
const  numberOfSamples=100;
for(let i=0;i<=numberOfSamples;++i)
{
  const factor=i/numberOfSamples;
  const time=Cesium.JulianDate.addSeconds(start,factor*totalSeconds,
  new Cesium.JulianDate() );
  const locationFactor=Math.pow(factor,2);
  const location=Cesium.Cartesian3.lerp(
    startPosition,
    endPosition,
    locationFactor,
    new Cesium.Cartesian3() );
  //使用提供的笛卡尔计算在 t 处的线性插值或外插。
  //start   Cartesian3  在 0.0 时对应于 t 的值。
  //end   Cartesian3  在 1.0 时对应于 t 的值。
  //t   Number  沿 t 进行插值的点。
  //result  Cartesian3  存储结果的对象。
  position.addSample(time,location);
  //添加一个新样本。
  //更新车模型的位置
  velocityVectorProperty.getValue(time,velocityVector);
  //获取速度矢量值,并放在velocityVector中
  const metersPerSecond=Cesium.Cartesian3.magnitude(velocityVector);
    //计算笛卡尔的大小(长度)。
  //参数:要计算其大小的笛卡尔实例。
  //米/秒
  const wheelRadius=0.52;
  //车轮半径
  const circumference=Math.PI*wheelRadius*2;//周长
  const rotationsPerSecond=metersPerSecond/circumference;
  //每秒转数
  //速度 =转速 X半径 X 2*math.pi
  wheelAngle+=((Math.PI*2*totalSeconds)/numberOfSamples)*
  rotationsPerSecond;//转速系数*转数
  wheelAngleProperty.addSample(time,wheelAngle);
  //添加插值采样
//更新轮胎(模型节点)的速度和旋转情况
}
function updateSpeedLabel(time,result){
  velocityVectorProperty.getValue(time,velocityVector);
  //在提供的时间获取属性的值。
  //result:将值存储到其中的对象,如果省略,则创建并返回一个新实例。
  const metersPerSecond=Cesium.Cartesian3.magnitude(velocityVector);
  //计算笛卡尔的大小(长度)。
  //参数:要计算其大小的笛卡尔实例。
  const kmPerHour=Math.round(metersPerSecond*3.6);//四舍五入函数
  return `${kmPerHour}km/hr`;
}
const rotationProperty=new Cesium.CallbackProperty(function(time,result){
  //一个 Property ,其值由回调函数延迟评估。
  return Cesium.Quaternion.fromAxisAngle(
    //一组 4 维坐标,用于表示 3 维空间中的旋转。
    //计算表示绕轴旋转的四元数。
    Cesium.Cartesian3.UNIT_X,//旋转轴
    wheelAngleProperty.getValue(time),//旋转角度(弧度值)
    //轮胎的旋转角度
    result
  );
},false);
//当回调函数每次返回相同的值时为 true ,如果值会改变则为 false 。
const wheelTransformation=new Cesium.NodeTransformationProperty({
  rotation:rotationProperty,//轮胎旋转矩阵
});
//产生数据类型:由平移、旋转和缩放定义的仿射变换。
const nodeTransformations={
  Wheels:wheelTransformation,
  Wheels_mid:wheelTransformation,
  Wheels_rear:wheelTransformation
};//模型节点及对应的运动矩阵
//添加模型
const vehicleEntity=viewer.entities.add({
  position:position,
  orientation:new Cesium.VelocityOrientationProperty(position),
  //指定实体方向的属性
  model:{
    uri:"../Source/SampleData/models/GroundVehicle/GroundVehicle.glb",
    runAnimations:false,
    nodeTransformations:nodeTransformations,
    //一个对象,其中键是节点的名称,
    //值是 TranslationRotationScale 描述要应用于该节点的转换的属性。
    //转换在 glTF 中指定的节点现有转换之后应用,并且不会替换节点的现有转换。
  },label:{
    text:new Cesium.CallbackProperty(updateSpeedLabel,false),
    //指定文本的属性。支持显式换行符 ''。
    font:"20px sans-serif",
    //指定 CSS 字体的属性。
    showBackground:true,
    //一个布尔属性,指定标签背后背景的可见性。
    distanceDisplayCondition: new Cesium.DistanceDisplayCondition(
      ////一个属性,指定将在距相机多远的距离处显示此标签。
      0.0,
      100.0
    ),
   
    //与此实体关联的 options.label。
    eyeOffset:new Cesium.Cartesian3(0,3.5,0)
    //指定眼睛偏移的 Cartesian3 属性。
  },
});
viewer.trackedEntity=vehicleEntity;
//获取或设置相机当前正在跟踪的实体实例。
vehicleEntity.viewFrom=new Cesium.Cartesian3(-10.0,7.0,4.0);
//获取或设置跟踪此对象时建议的初始偏移量。偏移量通常在东北上参考系中定义,
//但也可能是另一个参考系,具体取决于对象的速度。
 
 
代码结构思维导图

Cesium案例(六) Time Dynamic Wheels的更多相关文章

  1. WPF案例 (六) 动态切换UI布局

    原文:WPF案例 (六) 动态切换UI布局 这个Wpf示例对同一个界面支持以ListView或者CardView的布局方式呈现界面,使用控件ItemsControl绑定数据源,使用DataTempla ...

  2. cesium 学习(六) 坐标转换

    cesium 学习(六) 坐标转换 一.前言 在场景中,不管是二维还好还是三维也罢,只要涉及到空间概念都会提到坐标,坐标是让我们理解位置的一个非常有效的东西.有了坐标,我们能很快的确定位置相关关系,但 ...

  3. Httpd服务入门知识-Httpd服务常见配置案例之DSO( Dynamic Shared Object)加载动态模块配置

    Httpd服务入门知识-Httpd服务常见配置案例之DSO( Dynamic Shared Object)加载动态模块配置 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.加载动 ...

  4. Cesium案例解析(六)——3DTilesInspector监视器

    目录 1. 概述 2. 案例 1. 概述 3D Tiles作为传输和渲染大规模3D地理空间数据的格式,应对的都是大规模数据的场景,Cesium提供了一个监视3D Tiles数据的监视器,可以通过这个监 ...

  5. CSharp 案例:用 Dynamic 来解决 DataTable 数值累加问题

    需求说明 给定一个 DataTable,如果从中取出数值类型列的值并对其累加? 限制:不知该列是何种数值类型. 解决方案 1.将表转换为 IEnumerable<dynamic>,而后获取 ...

  6. Cesium案例解析(五)——3DTilesPhotogrammetry摄影测量3DTiles数据

    目录 1. 概述 2. 案例 3. 结果 1. 概述 3D Tiles是用于传输和渲染大规模3D地理空间数据的格式,例如摄影测量,3D建筑,BIM / CAD,实例化特征和点云等.与常规的模型文件格式 ...

  7. Cesium案例解析(三)——Camera相机

    目录 1. 概述 2. 实例 2.1. Camera.html 2.2. Camera.js 2.2.1. 飞行至某一点 2.2.2. 飞行至某区域 2.2.3. 两地之间飞行 2.2.4. 设置视图 ...

  8. awk处理之案例六:awk根据条件插入文本

    编译环境 本系列文章所提供的算法均在以下环境下编译通过. [脚本编译环境]Federa 8,linux 2.6.35.6-45.fc14.i686 [处理器] Intel(R) Core(TM)2 Q ...

  9. Cesium案例解析(二)——ImageryLayers影像图层

    目录 1. 概述 2. 实例 2.1. ImageryLayers.html 2.2. ImageryLayers.js 2.2.1. 代码 2.2.2. 解析 3. 结果 1. 概述 Cesium支 ...

  10. Cesium案例解析(一)——HelloWorld

    目录 1. 概述 2. 实例 2.1. HelloWorld.html 2.2. HelloWorld.js 3. 结果 1. 概述 感觉网上已经有不少关于cesium的教程了,但是学习一个框架最快的 ...

随机推荐

  1. 记一次pushgateway因文件句柄数太多未回收的问题

    1. 问题描述: Flink上报metrics到pushGateway,pushGwateway因打开在多文件而拒绝Flink TaskManager上报数据的连接.查看pushGateway的日志如 ...

  2. 小梅哥课程学习——串口发送应用之发送数据(可在vivado中仿真出现正确波形)

    //1.底层代码源代码发送10位数据 module uart_pr( clk, reset_n, send_go, data, baud_set, tx_done, uart_tx ); input ...

  3. Qt编译问题之FTH (7156) Fault tolerant heap shim applied to current process

    有时候Qt编译会出现FTH: (7156): *** Fault tolerant heap shim applied to current process. This is usually due ...

  4. 基于CMMI的软件工程及实训指导 第一章

    第一章 软件工程基础 1. 软件工程概述 1.1 软件工程概念 软件工程是从管理和技术两方面来研究如何采用工程的概念.原理和技术方面并加以综合,指导开发人员更好地开发和维护计算机软件的一门新学科. 1 ...

  5. NOI-1253:Dungeon Master(BFS)

    描述You are trapped in a 3D dungeon and need to find the quickest way out! The dungeon is composed of ...

  6. 确定linux系统网卡对应的物理网口

    没插网线的情况下系统上执行ethtool -p eth0 #eth0 对应的物理口一个灯在不停的闪烁ethtool  --identify  eth0 30 #eth0 对应的物理口闪烁30秒 ... ...

  7. python学习记录(四)-意想不到

    计数 from collections import Counter # 计数 res = Counter(['a','b','a','c','a','b']) print(res,type(res) ...

  8. VisualVM无法运行,修改配置文件

      在VisualVM安装位置下找到etc目录修改etc目录下的visualvm.conf文件 加入配置 参数 指定JDK或JRE路径,如 visualvm_jdkhome="C:\xxx\ ...

  9. 更新Vue-cli4与Eslint插件自动保存

    Vue-cli更新 此更新为Vue-cli3更新为4,可使用node来查看本机的安装版本,vue -V,此版本(cli4)需要node v8.9 或更高版本 (推荐 v10 以上),查看node版本可 ...

  10. 让VMWARE ESXI 虚拟机开机进入BIOS设置

    VMware vSphere Client 里面选中需要从光驱启动的客户机,单击右键选择 "编辑设置", 在虚拟机属性的窗口里面选择 "选项 "选项卡 ,单击& ...