效果图

组件说明:
1.开始、暂停按钮使用的cesium自带的,通过css隐藏了周围的圆
2.上边的滑块使用的iview的slide滑块(min:1 max:100)
滑动滑块触发事件
// 滑块改变
slideChange(data) {
console.log(data)
// this.viewer.cesiumWidget.clock
this.viewer.clockViewModel.multiplier = data * 1000 // data乘以1000是为了效果更明显,这里的1000可以根据项目需求自定
this.viewer.timeline.updateFromClock() // 更新timeline时间轴
// console.log(this.viewer.clockViewModel.multiplier)
},
本文介绍了一种使用Cesium和iView组件库实现的时间轴控制方法。通过自定义CSS隐藏Cesium的默认元素,并利用iView的slide滑块组件,实现了时间轴的动态调整。滑块范围设定为1到100,滑动时会触发事件,调整Cesium的时间轴播放速度,提供更直观的时间控制体验。
777

被折叠的 条评论
为什么被折叠?



