前言

最近需要在Cesium地图上增加一个控制方向的罗盘,Ceisum没有自带这个插件,于是去网上各种查询。我的项目是基于vue的,使用import的当时引入的,但是很多文章提供的demo是基于传统的全局变量的当时引入的,不太适用。最后终于找到了对应的解决方法。使用@znemz/cesium-navigation 插件。

使用方法

//引入
import CesiumNavigation from "cesium-navigation-es6";
//ceisum实例化
const viewer = new Cesium.Viewer('map3d', {
        terrainProvider: new Cesium.EllipsoidTerrainProvider({}),
        // terrainProvider:terrainLayer,
        // imageryProvider:image_provider_item,
        baseLayerPicker:false,
        homeButton:false,
        infoBox:false,
        timeline:false,
        navigationHelpButton:false,
        geocoder:false,
        sceneModePicker:false,
        animation:false,
        fullscreenButton:false
      });

//配置项
let options = {enableCompass:true,enableZoomControls:false,enableCompassOuterRing:true,enableDistanceLegend:false};

//添加罗盘
CesiumNavigation(viewer, options);

效果展示

Cesium增加导航罗盘_罗盘