Cesium指南针

cesium里面没有指南针

需要安装其他的插件: cesium-navigation-es6

npm i cesium-navigation-es6 -S

安装好之后在mainjs里引入

import CesiumNavigation from 'cesium-navigation-es6'

配置一下CesiumNavigation的全局变量

Vue.prototype.CesiumNavigation = CesiumNavigation

在vue页面的初始化里加上

复制代码
var options = {}
      // 用于在使用重置导航重置地图视图时设置默认视图控制。接受的值是Cesium.Cartographic 和Cesium.Rectangle.
      options.defaultResetView = this.Cesium.Cartographic.fromDegrees(115, 30, 2000000);
      // 用于启用或禁用罗盘。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;
      this.CesiumNavigation(this.viewer, options);
复制代码

地球上就会出现 罗盘 放大缩小 比例尺,根据自己的需求更改颜色或位置

=========================2020.1.3============================

如果说你安装了该插件,最后运行报错,如下:

* cesium in ./node_modules/cesium-navigation-es6/CesiumNavigation.js, ./node_modules/cesium-navigation-es6/core/registerKnockoutBindings.js and 8 others

那么你就得去关注一下你的 cesium-navigation-es6的版本了  1.0.9这个版本是可用的 

安装:

npm i cesium-navigation-es6@1.0.9 -S

posted @   环岛公路  阅读(3790)  评论(1编辑  收藏  举报
编辑推荐:
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
阅读排行:
· winform 绘制太阳,地球,月球 运作规律
· AI与.NET技术实操系列(五):向量存储与相似性搜索在 .NET 中的实现
· 超详细:普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)
点击右上角即可分享
微信分享提示