知識點和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); //獲取或設定跟蹤此物件時建議的初始偏移量，偏移量通常在東北上參考系中定義， //但也可能是另一個參考系，具體取決于物件的速度， 代碼結構思維導圖
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/549341.html
標籤：其他