草庐IT

Cesium案例（六） Time Dynamic Wheels

BlackCaat 2023-04-11 原文
  知识点和api都以注释的形式标注在了代码中，学习Cesium官方案例可以作为辅助理解代码，进行自我学习和案例复现。
主要学习网站：cesium官网案例源码 cesium中文网api文档
 
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);
//获取或设置跟踪此对象时建议的初始偏移量。偏移量通常在东北上参考系中定义，
//但也可能是另一个参考系，具体取决于对象的速度。
 
 
代码结构思维导图

 

DynamicCesiumquotspan212

有关Cesium案例（六） Time Dynamic Wheels的更多相关文章

  1. 「Python｜Selenium｜场景案例」如何定位iframe中的元素？ - 2

    本文主要介绍在使用Selenium进行自动化测试或者任务时，对于使用了iframe的页面，如何定位iframe中的元素文章目录场景描述解决方案具体代码场景描述当我们在使用Selenium进行自动化测试的时候，可能会遇到一些界面或者窗体是使用HTML的iframe标签进行承载的。对于iframe中的标签，如果直接查找是无法找到的，会抛出没有找到元素的异常。比如近在咫尺的例子就是，CSDN的登录窗体就是使用的iframe，大家可以尝试通过F12开发者模式查看到的tag_name,class_name,id或者xpath来定位中的页面元素，会抛出NoSuchElementException异常。解决

  2. ruby &&= 边缘案例 - 2

    有点边缘情况，但知道为什么&&=会这样吗？我正在使用1.9.2。obj=Object.newobj.instance_eval{@bar&&=@bar}#=>nil,expectedobj.instance_variables#=>[],soobjhasno@barinstancevariableobj.instance_eval{@bar=@bar&&@bar}#ostensiblythesameas@bar&&=@barobj.instance_variables#=>[:@bar]#whywouldthisversioninitialize@bar?为了比较，||=将实例变量初始

  3. Cesium源码解析一（terrain文件的加载、解析与渲染全过程梳理） - 2

    快速导航（持续更新中…）Cesium源码解析一（terrain文件的加载、解析与渲染全过程梳理）Cesium源码解析二（metadataAvailability的含义）Cesium源码解析三（metadata元数据拓展中行列号的分块规则解析）Cesium源码解析四（Quantized-Mesh(.terrain)格式文件在CesiumJS和UE中加载情况的对比）目录1.前言2.本篇的由来3.terrain文件的加载3.1更新环境3.2更新和执行渲染命令3.3数据优化3.4结束当前帧4.总结1.前言  目前市场上三维比较火的实现方案主要有两种，b/s的方案主要是Cesium，c/s的方案主要是u

  4. ruby - 使用散列或案例陈述 [Ruby] - 2

    一般来说哪个更好用？:casenwhen'foo'result='bar'when'peanutbutter'result='jelly'when'stack'result='overflow'returnresult或map={'foo'=>'bar','peanutbutter'=>'jelly','stack'=>'overflow'}returnmap[n]更具体地说，什么时候应该使用案例陈述，什么时候应该只使用散列？ 最佳答案 散列是一种数据结构，而case语句是一种控制结构。当你只是检索一些数据时，你应该使用散列(就像你

  5. Ruby:案例使用对象 - 2

    有没有办法在case语句的对象上隐式调用方法？即:classFoodefbar1enddefbaz...endend我希望能够做的是这样的事情......foo=Foo.newcasefoowhen.bar==1then"something"when.bar==2then"somethingelse"when.baz==3then"anotherthing"end...其中“when”语句正在评估case对象上方法的返回。这样的结构可能吗？如果是的话，我还没有弄清楚语法...... 最佳答案 FWIW，您根本不需要将对象传递给1.8

  6. BigData/Cloud Computing：基于阿里云技术产品的人工智能与大数据/云计算/分布式引擎的综合应用案例目录来理解技术交互流程 - 2

    BigData/CloudComputing：基于阿里云技术产品的人工智能与大数据/云计算/分布式引擎的综合应用案例目录来理解技术交互流程目录一、云计算网站建设：部署与发布网站建设：简单动态网站搭建云服务器管理维护云数据库管理与数据迁移云存储：对象存储管理与安全超大流量网站的负载均衡二、大数据MOOC网站日志分析搭建企业级数据分析平台基于LBS的热点店铺搜索基于机器学习PAI实现精细化营销基于机器学习的客户流失预警分析使用DataV制作实时销售数据可视化大屏使用MaxCompute进行数据质量核查使用Quick BI制作图形化报表使用时间序列分解模型预测商品销量三、云安全云平台使用安全云上服务

  7. ruby-on-rails - 关于这个 Rails 关联案例中的 "<<"运算符 - 2

    我是RubyonRails的新手。在Rails应用程序中，我看到了如下代码:在模型中，有一个类Car:classCar在controller中，有一个方法“some_method”classCarsController我有三个问题要问:1.在Controller的代码中@my_car.components，它有什么作用？什么是什么意思？2.“3.是否Car类必须显式定义has_many关联Componentclassif""isused或者是""可用于向Car添加新关联，即使关联未在Car中定义显式类？ 最佳答案 编辑后:第1点@m

  8. Spring Security详细讲解(JWT+SpringSecurity登入案例) - 2

    本篇博文目录:一.SpringSecurity简介1.SpringSecurity2.SpringSecurity相关概念二.认证和授权1.认证(1)使用SpringSecurity进行简单的认证(SpringBoot项目中)(2)SpringSecurity的原理(3)SpringSecurity核心类(4)认证登入案例(JWT+SpringSecurity实现登入案例)2.授权(1)加入权限到Authentication中(2)SecurityConfig配置文件中开启注解权限配置(3)给接口中的方法添加访问权限(4)用户权限表的建立3.自定义失败处理(1)创建异常处理类(2)配置移除处理

  9. ruby-on-rails - Ruby on Rails 案例/开关。如何匹配对象？ - 2

    我正在开发ruby​​onrails应用程序。对于sessionController，我想用一个案例来检查用户的帐户是否被锁定或禁止。我正在尝试使用类的对象作为案例，并使用when来检查属性。例如，user=Profile.find(1)caseuserwhenuser.banredirect_to()whenuser.lockredirect_to()elseredirect_to()end唯一的问题是它不起作用。这是什么工作:caseuser.banwhentrueredirect_to()elseredirect_to()end关于如何使用开关检查用户对象是否被禁止或锁定，有什么

  10. ruby - Sinatra 成功案例 - 2

    关闭。这个问题是off-topic.它目前不接受答案。想改进这个问题吗？Updatethequestion所以它是on-topic用于堆栈溢出。关闭11年前。Improvethisquestion您成功使用过Sinatra吗？这是一个什么样的项目？在什么情况下您会推荐使用Sinatra而不是Rails或Merb？

随机推荐