1、安裝cesium-navigation

npm i cesium-navigation-es6 -S

2、引入

import CesiumNavigation from 'cesium-navigation-es6'

3、配置全局變量

Vue.prototype.CesiumNavigation = CesiumNavigation

?4、使用

在初始化cesium界面時使用。

let options = {};// 用于在使用重置導航重置地圖視圖時設置默認視圖控制。接受的值是Cesium.Cartographic 和 Cesium.Rectangle.options.defaultResetView = Rectangle.fromDegrees(80, 22, 130, 50);// 用于啟用或禁用羅盤。true是啟用羅盤，false是禁用羅盤。默認值為true。如果將選項設置為false，則羅盤將不會添加到地圖中。options.enableCompass= true;// 用于啟用或禁用縮放控件。true是啟用，false是禁用。默認值為true。如果將選項設置為false，則縮放控件將不會添加到地圖中。options.enableZoomControls= true;// 用于啟用或禁用距離圖例。true是啟用，false是禁用。默認值為true。如果將選項設置為false，距離圖例將不會添加到地圖中。options.enableDistanceLegend= true;// 用于啟用或禁用指南針外環。true是啟用，false是禁用。默認值為true。如果將選項設置為false，則該環將可見但無效。options.enableCompassOuterRing= true;new CesiumNavigation(viewer, options)// CesiumNavigation(viewer, options)

注意：如若寫成?CesiumNavigation(viewer, options)則會報錯：Cannot set properties of undefined (setting 'terria')，要將CesiumNavigation(viewer, options)實例化new?CesiumNavigation(viewer, options)。

總結

以上是生活随笔為你收集整理的Vue加载cesium指南针插件cesium-navigation的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。