Cesium 清除clock的tick事件
在VUE+Cesium开发中,需要实时获取cesium clock的tick每一帧的时间,并在界面显示,示例代码为:function tick() {viewer.clock.tick();Cesium.requestAnimationFrame(tick);let currentUTC = Cesium.JulianDate.clone(viewer.clock.currentTime);
·
在VUE+Cesium开发中,需要实时获取cesium clock的tick每一帧的时间,并在界面显示,示例代码为:
function tick() {
viewer.clock.tick();
Cesium.requestAnimationFrame(tick);
let currentUTC = Cesium.JulianDate.clone(
viewer.clock.currentTime
);
let currentBJ = Cesium.JulianDate.addHours(
currentUTC,
8,
new Cesium.JulianDate()
);//显示改为北京时间,需要加8个小时
let currentBJString = String(currentBJ);
let currentDateSplit = currentBJString.slice(0, 19);
this.currentTime = currentDateSplit;//data中变量,显示当前时间
console.log(viewer.clock.currentTime);//后台打印实时时间
}
但是,想在点击清除的时候,却一直清除不了。代码如下:
window.cesiumViewer.clock.shouldAnimate = false;
window.cesiumViewer.clock.canAnimate = false;
this.currentTime = "";
调试时发现 this.currentTime = ""已经修改,但是显示在界面的还是暂停时的时间,html代码:
<p>{{currentTime}}</p>
data() {
return {
currentTime: "",
};
},
后台也一直在打印console.log(window.cesiumViewer.clock.currentTime)的值;
查看cesium的帮助文档发现,cesium的clock无法清除,tick会一直走,但是在帮助文档发现这样一段:
因此我们只需调用Cesium.cancelAnimationFrame即可取消请求,点击红框的链接,按照这个方法即可取消请求,this.currentTime = ""也成功实现。
更多推荐
已为社区贡献3条内容
所有评论(0)