# 感性認識 ## 界面介紹，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**