cesium 路径漫游

之前写过相似的轨迹回放,按路径飞行demo的理解,但与实际数据结合起来的时候还是花了一些时间 。
且之前的数据是已经处理成满足要求的格式的了,实际上很多时候并不是,因此重新来梳理如何实现这个效果
先看数据格式
拿到这样的json之后,我们需要将时间与成对的存入中
然后赋值给模型的属性即可 。

cesium 路径漫游

文章插图
那么拿到这样的数据,首先对时间进行处理
设置漫游的起始时间与终止时间
时间与位置成对存储
cesium 路径漫游

文章插图
加载模型
最后效果
【cesium 路径漫游】代码
var viewer = initCesium.initViewer('cesiumContainer',{animation: true,timeline: true,infoBox: false, //Disable InfoBox widgetselectionIndicator: false, //Disable selection indicatorshouldAnimate: true, // Enable animations// terrainProvider: Cesium.createWorldTerrain()});var url = "./onet.json"/*json文件url,本地的就写本地的位置,如果是服务器的就写服务器的路径*/var request = new XMLHttpRequest();request.open("get", url);/*设置请求方法与路径*/request.send(null);/*不发送数据到服务器*/request.onload = function () {/*XHR对象获取到返回信息后执行*/if (request.status == 200) {/*返回状态为200,即为数据获取成功*/var json = JSON.parse(request.responseText);let arr=json.RECORDSconsole.log(arr)let time=arr[0].f1let startTime=new Date(time.substring(0,4),time.substring(4,6),time.substring(6,8),time.substring(8,10),time.substring(10,12),time.substring(12,14))var start = Cesium.JulianDate.fromDate(startTime);time=arr[9].f1let endTime=new Date(time.substring(0,4),time.substring(4,6),time.substring(6,8),time.substring(8,10),time.substring(10,12),time.substring(12,14))var stop = Cesium.JulianDate.fromDate(endTime);viewer.clock.startTime = start.clone();viewer.clock.stopTime = stop.clone();viewer.clock.currentTime = start.clone();viewer.clock.clockRange = Cesium.ClockRange.LOOP_STOP; //Loop at the endviewer.clock.multiplier = 1;//arr=arr.slice(0,9)var position = computeCirclularFlight(arr);var entity = viewer.entities.add({//Set the entity availability to the same interval as the simulation time.availability : new Cesium.TimeIntervalCollection([new Cesium.TimeInterval({start : start,stop : stop})]),position : position,orientation : new Cesium.VelocityOrientationProperty(position),model : {uri : '../data/models/CesiumAir/Cesium_Air.gltf',minimumPixelSize : 64},path : {resolution : 1,material : new Cesium.PolylineGlowMaterialProperty({glowPower : 0.1,color : Cesium.Color.YELLOW}),width : 10}});viewer.trackedEntity=entityvar params={h:90,p:-90,r:0}// Object.defineProperty(params,"h", {//set: function(newval){// 通过set方法可以拿到新的值//console.log(newval)//this.h= newval//}// })viewer.camera.setView({orientation: {heading : Cesium.Math.toRadians(180), // east, default value is 0.0 (north)pitch : Cesium.Math.toRadians(params.p),// default value (looking down)roll : 0.0// default value}});//viewer.zoomTo(viewer.entities, new Cesium.HeadingPitchRange(0, Cesium.Math.toRadians(-90)));return}}