
自动旋转 ·Auto Rotate· ▶ 在线运行案例案例合集三维可视化功能案例threehub.cn开源仓库github地址https://github.com/z2586300277/three-cesium-examples400个案例代码:网盘链接你将学到什么viewer.clock.onTick每帧回调camera.rotate(axis, angle)绕轴旋转展览大屏「地球自动转」实现效果说明加载影像地球后相机持续绕 Z 轴UNIT_Z旋转类似展厅自动播放。核心概念viewer.clock.onTick.addEventListener(() {viewer.scene.camera.rotate(Cesium.Cartesian3.UNIT_Z, 0.01); });| 参数 | 含义 | |------|------| |UNIT_Z| 绕地心垂直轴转经度方向环绕 | |0.01| 弧度/ tick越大越快 |可在回调内加条件鼠标交互时暂停等。与 OrbitControls 的autoRotate不同这里是直接改 Cesium 相机。实现步骤初始化 Viewer隐藏 credit 容器viewer.clock.onTick.addEventListener注册每帧回调camera.rotate(UNIT_Z, angle)持续绕地轴旋转可选鼠标按下时跳过 rotate实现「交互暂停」代码要点import * as Cesium from cesium// Cesium官网的token Cesium.Ion.defaultAccessToken your-cesium-ion-access-tokenconst box document.getElementById(box)const viewer new Cesium.Viewer(box, {imageryProvider: false, //关闭默认底图animation: false,//是否创建动画小器件左下角仪表baseLayerPicker: false,//是否显示图层选择器右上角图层选择按钮fullscreenButton: false,//是否显示全屏按钮右下角全屏选择按钮geocoder: false,//是否显示geocoder小器件右上角查询按钮homeButton: false,//是否显示Home按钮右上角home按钮sceneMode: Cesium.SceneMode.SCENE3D,//初始场景模式sceneModePicker: false,//是否显示3D/2D选择器右上角按钮navigationHelpButton: false,//是否显示右上角的帮助按钮selectionIndicator: false,//是否显示选取指示器组件timeline: false,//是否显示时间轴infoBox: false,//是否显示信息框scene3DOnly: true,//如果设置为true则所有几何图形以3D模式绘制以节约GPU资源orderIndependentTranslucency: false, //是否启用无序透明contextOptions: { webgl: { alpha: true } },skyBox: new Cesium.SkyBox({ show: false })})viewer.scene.sun.show falseviewer.scene.moon.show falseviewer.scene.skyBox.show falseviewer.scene.backgroundColor new Cesium.Color(0.0, 0.0, 0.0, 0.0)viewer._cesiumWidget._creditContainer.style.display noneconsole.log(Cesium.VERSION)完整源码GitHub小结