# 感性认识 ## 界面介绍，viewer  1. Geocoder : 查找位置工具，查找到之后会将镜头对准找到的地址，默认使用bing地图 2. Home Button :视角返回初始位置. 3. Scene Mode Picker : 选择视角的模式，有三种：3D，2D，哥伦布视图(CV) 4. Base Layer Picker : 图层选择器，选择要显示的地图服务和地形服务. 5. Navigation Help Button :导航帮助按钮，显示默认的地图控制帮助. 6. Animation : 动画器件，控制视图动画的播放速度. 7. Timeline :时间线,指示当前时间，并允许用户跳到特定的时间. 8. Credits Display :版权显示，显示数据归属，必选 9.Fullscreen Button :全屏按钮. ## 隐藏界面中的元素 在开发自己的项目时，有时候需要对界面做一定的定制，这就需要隐藏一部分界面中的元素，下面我们来看看各个元素的描述 首先创建一个空的工程来测试，源码在[https://gitee.com/HQCode/Cesium-test](https://gitee.com/HQCode/Cesium-test)  ### 方法一 通过js代码控制 界面上默认的小控件可以通过在初始化Viewer的时候设置相应的属性来关闭，一下列出了界面默认的小控件的关闭方法，还有很多额外的属性，可以查看 帮助文档 ``` <div id="credit"></div> var viewer = new Cesium.Viewer('cesiumContainer',{ geocoder:false, homeButton:false, sceneModePicker:false, baseLayerPicker:false, navigationHelpButton:false, animation:false, creditContainer:"credit", timeline:false, fullscreenButton:false, vrButton:false, // skyBox : new Cesium.SkyBox({ // sources : { // positiveX : 'stars/TychoSkymapII.t3_08192x04096_80_px.jpg', // negativeX : 'stars/TychoSkymapII.t3_08192x04096_80_mx.jpg', // positiveY : 'stars/TychoSkymapII.t3_08192x04096_80_py.jpg', // negativeY : 'stars/TychoSkymapII.t3_08192x04096_80_my.jpg', // positiveZ : 'stars/TychoSkymapII.t3_08192x04096_80_pz.jpg', // negativeZ : 'stars/TychoSkymapII.t3_08192x04096_80_mz.jpg' // } // }) }); ``` 相关代码[lesson01-index.html](https://gitee.com/HQCode/Cesium-test) ### 方法二 通过css控制 ``` /* 不占据空间，无法点击 */ .cesium-viewer-toolbar, /* 右上角按钮组 */ .cesium-viewer-animationContainer, /* 左下角动画控件 */ .cesium-viewer-timelineContainer, /* 时间线 */ .cesium-viewer-bottom /* logo信息 */ { display: none; } .cesium-viewer-fullscreenContainer /* 全屏按钮 */ { position: absolute; top: -999em; } ``` >注：全屏按钮不能通过display:none的方式来达到隐藏的目的，这是因为生成的按钮控件的行内样式设置了display属性，会覆盖引入的css属性 ``` <div class="cesium-viewer-fullscreenContainer" style="display: block;">...</div> ``` 相关代码[lesson01-index02.html](https://gitee.com/HQCode/Cesium-test) ### 显示帧速(FPS) ``` viewer.scene.debugShowFramesPerSecond = true; ```  **Cesium学习交流群:593764057(满),476893082**