cesium 自带timeline animation空间有时候满足不了项目的需求,需求要通过自己设置时间来改变光照
this.viewer = new Cesium.Viewer('cesiumContainer', { animation: false, //是否显示动画控件 homeButton: false, //是否显示home键 geocoder: false, //是否显示地名查找控件 baseLayerPicker: false, //是否显示图层选择控件 timeline: false, //是否显示时间线控件 fullscreenButton: false, //是否全屏显示 scene3DOnly: true, //如果设置为true,则所有几何图形以3D模式绘制以节约GPU资源 infoBox: true, //是否显示点击要素之后显示的信息 sceneModePicker: false, //是否显示投影方式控件 三维/二维 navigationInstructionsInitiallyVisible: false, navigationHelpButton: false, //是否显示帮助信息控件 selectionIndicator:false, // 影像图 imageryProvider: new Cesium.ArcGisMapServerImageryProvider({ url: server + ':6080/arcgis/rest/services/dls/CesiumImagery/MapServer' }), // terrainProvider: Cesium.createWorldTerrain() // 地形图 terrainProvider: new Cesium.CesiumTerrainProvider({ url: server + ':8080/terrain', requestVertexNormals: true // 地形图上添加此属性 效果更好 }) }) this.viewer._cesiumWidget._creditContainer.style.display = 'none' // 去除版权信息 this.viewer.scene.globe.depthTestAgainstTerrain = true this.scene = this.viewer.scene this.camera = this.viewer.camera this.scene.globe.enableLighting = true
上边是初始化cesium的一些配置属性
重点:关键
1.开始一直想的是通过设置this.viewer.clock.currentTime来改变viewer的时间进而改变光照,但是发现始终设置不成功
原来是因为它只能获取不能设置
2.需要使用clockViewModel,具体为什么,没研究,但是这个是可以设置成功的,参考案例:https://sandcastle.cesium.com/index.html?src=Clock.html
3.具体使用
var utc=Cesium.JulianDate.fromDate(new Date("2019/10/04 09:00:00"));//UTC this.viewer.clockViewModel.currentTime = Cesium.JulianDate.addHours(utc,8,new Cesium.JulianDate());//北京时间=UTC+8=GMT+8
这里涉及到一个知识点:julianDate与Date之间的转换关系(参考文档:https://blog.csdn.net/xiaotian602574436/article/details/78293637)
js创建的Date对象是北京时间,但是与JulianDate的日期是不同的,cesium中显示的时间与Date日期的时间是差8个小时。北京时间=JulianDate+8
var date=new Date(“2019/10/04 12:30:00”);//时间为:2019/10/04 12:00:00
var julianTime=Cesium.JulianDate.fromDate(date); //转为JulianDate
//设置时钟的当前日期
this.viewer.clock.currentTime=julianTime.clone();//时钟上显示的时间为:2019/10/04 20:00:00
想让时钟显示 2019/10/04 12:00:00
var utc=Cesium.JulianDate.fromDate(new Date("2019/10/04 12:00:00"));//UTC
this.viewer.clock.currentTime=Cesium.JulianDate.addHours(utc,8,new Cesium.JulianDate());//北京时间=UTC+8=GMT+8