cesium【05-时钟】

Clock（时钟）相关的主要有Animation控件和Timeline控件，通常两者会放在一起使用。

Clock内部以 JulianDate 维护时间，比北京时间慢8个小时。所有要想显示北京时间需要计算偏差。

 

Clock

//达到时钟的行为方式 
let clockRange = {
    'LOOP_STOP':Cesium.ClockRange.LOOP_STOP,//到达点后循环执行
    'CLAMPED':Cesium.ClockRange.CLAMPED,//到达点不再进一步前进
    'UNBOUNDED':Cesium.ClockRange.UNBOUNDED//到达点后，向后移动
}
//设置开始和结束时间
function getDate(seconds=3600){
    let d = new Date();
    let t = [d.getFullYear(),d.getMonth(), d.getDate(),d.getHours()+8,d.getMinutes(),d.getSeconds()]
    let start = Cesium.JulianDate.fromDate(new Date(t[0],t[1],t[2],t[3],t[4],t[5]));
    let stop = Cesium.JulianDate.addSeconds(start, seconds, new Cesium.JulianDate());
    return{
        start,
        stop
    }
}
let gd = getDate();
//设置clock
let clock = new Cesium.Clock({
    startTime:gd.start,//时钟的开始时间
    currentTime:gd.start,//当前时间
    stopTime:gd.stop,//时钟的停止时间
    multiplier:1,//时间速率
    clockRange:clockRange.LOOP_STOP,//达到时钟的行为方式 
})
//读取clock
console.log(viewer.clock)

 

Animation

//设置Animation当前时间为北京时间
function Animation(){
    var d = new Date();//获取javascript当前时间
    var hour = 0 - d.getTimezoneOffset();//时间差
    //获取视图模型,并设置格式化显示时间的函数。
    viewer.animation.viewModel.timeFormatter = function (date, viewModel) {
        var dateZone8 = Cesium.JulianDate.addMinutes(date, hour, new Cesium.JulianDate());
        var gregorianDate = Cesium.JulianDate.toGregorianDate(dateZone8);
        var millisecond = Math.round(gregorianDate.millisecond);
        if (Math.abs(viewModel._clockViewModel.multiplier) < 1) {
            return Cesium.sprintf("%02d:%02d:%02d.%03d;", gregorianDate.hour, gregorianDate.minute, gregorianDate.second);
        }
        return Cesium.sprintf("%02d:%02d:%02d GMT+8", gregorianDate.hour, gregorianDate.minute, gregorianDate.second);
    };
}
Animation();

 

Timeline

viewer.timeline.zoomTo(gd.start,gd.stop)