Day2「操控地球：旋转、缩放、飞行与视角复位」 2025-08-07 Cesium基础开发教程 無 # Day2「操控地球：旋转、缩放、飞行与视角复位」 ## 让上一个html变得整洁，去除控件 ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://cesium.com/downloads/cesiumjs/releases/1.132/Build/Cesium/Cesium.js"></script> <link href="https://cesium.com/downloads/cesiumjs/releases/1.132/Build/Cesium/Widgets/widgets.css" rel="stylesheet"> <title>整洁的空Cesium Earth</title> <style> /* 重置基本样式 */ html, body, #earth { width: 100%; height: 100%; margin: 0; padding: 0; } .cesium-widget-credits { display: none !important; } </style> </head> <body> <div id="earth"></div> <script> const viewer = new Cesium.Viewer('earth', { animation: false,// 去除左下角的动画控件 geocoder: false,// 去除右上角的搜索控件 cesiumWidget: false,// 去除右上角的版权信息 fullscreenButton: false,// 去除右上角的全屏控件 homeButton: false,// 去除右上角的主页控件 sceneModePicker: false,// 去除右上角的场景模式控件 timeline: false,// 去除下方的时间线控件 navigationHelpButton: false,// 去除右上角的帮助控件 baseLayerPicker: false, // 去除默认的影像图层 }); </script> </body> </html> ``` >效果图片  ## 核心API | 功能 | API | |-------|-----------------------------| | 旋转 俯仰 | ScreenSpaceCameraController | | 缩放 | camera.zoomIn / zoomOut | | 飞行 | camera.flyTo(options) | ## API讲解 >相关文档：https://www.bestuss.cn/Build/Documentation/ 在文档中搜索ScreenSpaceCameraController  ### 实战应用 >前往Github查看相关代码，在本地自行运行查看效果 ### 自动旋转展示 ```javascript viewer.clock.onTick.addEventListener(() => { viewer.scene.camera.rotate(Cesium.Cartesian3.UNIT_Z, 0.001); }); ``` 效果展示：  Loading content...