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

Cesium指南针的更多相关文章

  1. Cesium坐标系及坐标转换详解

    前言 Cesium项目中经常涉及到模型加载.浏览以及不同数据之间的坐标转换,弄明白Cesium中采用的坐标系以及各个坐标系之间的转换,是我们迈向三维GIS大门的前提,本文详细的介绍了Cesium中采用 ...

  2. Cesium中的坐标系及转换

    在我们开始学习Entity之前,我们首先需要先学习下Cesium中的坐标系,Cesium中有多个坐标系,在进行添加Entity时经常会使用到. 一.坐标系介绍 我们先来列举下Cesium中的坐标系:W ...

  3. cesium自定义气泡窗口infoWindow

    一.自定义气泡窗口与cesium默认窗口效果对比: 1.cesium点击弹出气泡窗口显示的位置固定在地图的右上角,默认效果: 2.对于习惯arcgis或者openlayer气泡窗口样式的giser来说 ...

  4. cesium核心类Viewer简介

    1.简单描述Viewer Viewer类是cesium的核心类,是地图可视化展示的主窗口,cesium程序应用的切入口,扮演必不可少的核心角色. 官网的英文解析如下: A base widget fo ...

  5. Cesium简介以及离线部署运行

    Cesium简介 cesium是国外一个基于JavaScript编写的使用WebGL的地图引擎,一款开源3DGIS的js库.cesium支持3D,2D,2.5D形式的地图展示,可以自行绘制图形,高亮区 ...

  6. Cesium教程系列汇总

    Cesium系列目录: 应用篇 入门 Cesium应用篇:1快速搭建 影像 Cesium应用篇:2影像服务(上) Cesium应用篇:2影像服务(下) 控件 Cesium应用篇:3控件(1)Clock ...

  7. Cesium原理篇:GroundPrimitive

    今天来看看GroundPrimitive,选择GroundPrimitive有三个目的:1 了解GroundPrimitive和Primitive的区别和关系 2 createGeometry的特殊处 ...

  8. Cesium原理篇:Batch

    通过之前的Material和Entity介绍,不知道你有没有发现,当我们需要添加一个rectangle时,有两种方式可供选择,我们可以直接添加到Scene的PrimitiveCollection,也可 ...

  9. Cesium原理篇:Material

    Shader 首先,在本文开始前,我们先普及一下材质的概念,这里推荐材质,普及材质的内容都是截取自该网站,我觉得他写的已经够好了.在开始普及概念前,推荐一首我此刻想到的歌<光---陈粒>. ...

随机推荐

  1. 二、sqlyog的使用

    1. 创建数据库. 注意字符集 2.创建表 注意 表名.引擎名.字符集

  2. Struts2学习笔记 - namespace命名空间

    默认的命名空间“ namespace="" ”. 根命名空间 “ namespace="/" ”. <package name="test&qu ...

  3. JavaSE---多线程---线程组

    1.概述 1.1 Java中使用ThreadGroup表示线程组,可以对一批线程进行分类管理: Java运行程序直接对  线程组 进行控制,对线程组的控制相当于 同时控制这组线程: 一旦线程加入某一组 ...

  4. python3 实现简单ftp服务功能(客户端)

    转载请注明出处! 可执行的命令: lspwdcd put rm get mkdir 上传下载,显示进度百分比以及平均上传下载速度 客户端 main代码: #Author by Andy #_*_ co ...

  5. PHP filter_input_array() 函数

    定义和用法 filter_input_array() 函数从脚本外部获取多项输入(比如表单输入),并进行过滤. 该函数对过滤多个输入变量很有用,无需重复调用 filter_input(). 该函数可从 ...

  6. 兼容新旧浏览器的flex写法

    拷贝直接加类名即可 /* 定义 */ .flex-def { display: -webkit-box; /* 老版本语法: Safari, iOS, Android browser, older W ...

  7. CDN技术详解(七)

    动态内容加速服务的实现 随着Web2.0的兴起,产生了动态网页.个性化内容.电子交易数据等内容的加速,这些就涉及了动态内容加速技术. 静态内容的加速,都是对于表现层的加速,对于动态页面等内容的加速,则 ...

  8. SQL中循环的实现方式

    一.第一种方法,游标 定义游标 DECLARE cur_ClubHeadCash CURSOR FAST_FORWARD READ_ONLY FOR,循环每行 FETCH NEXT FROM cur_ ...

  9. css 布局(圣杯、双飞翼)

    一. 圣杯布局. 左右固宽,中间自适应 三列布局,中间宽度自适应,两边定宽: 中间部分要在浏览器中优先展示渲染: 具体步骤:1.设置基本样式2.圣杯布局是一种相对布局,首先设置父元素container ...

  10. mybatis原理与设计模式-日志模块- 适配器模式

    在讲设计模式之前,得先知道java程序设计中得六大原则,才能更好得理解我们得系统为什么需要设计模式 1 单一职责原则 一个类只负责一种职责,只有这种职责的改变会导致这个类的变更.绕口一点的正统说法:不 ...