博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Cesium入门4 - 创建Cesium Viewer
阅读量:7032 次
发布时间:2019-06-28

本文共 2041 字,大约阅读时间需要 6 分钟。

hot3.png

Cesium入门4 - 创建Cesium Viewer

Cesium中文网: | 国内快速访问:

任何Cesium应用程序的基础都是Viewer。Viewer是一个带有多种功能的可交互的三位数字地球的容器(盒子)。创建一个Viewer和HTML中的一个id为"cesiumContainer"的div绑定即可。

var viewer = new Cesium.Viewer('cesiumContainer');

使用以上代码之后,能看到下图所示的基本的数字地球:

默认地,场景支持鼠标(电脑)和手指(移动设备)交互。控制相机漫游数字地球可以通过以下方式:

  • Left click and drag - Pans the camera over the surface of the globe.
  • Right click and drag - Zooms the camera in and out.
  • Middle wheel scrolling - Also zooms the camera in and out.
  • Middle click and drag - Rotates the camera around the point on the surface of the globe. 翻译
  • 按住鼠标左键拖拽 - 让相机在数字地球平面平移。
  • 按住鼠标右键拖拽 - 放缩相机。
  • 鼠标滚轮滑动 - 放缩相机。
  • 按住鼠标中键拖拽 - 在当前地球的屏幕中间点,旋转相机。

默认的Viewer自带了一些有用的组件:

  1. Geocoder : A location search tool that flies the camera to queried location. Uses Bing Maps data by default.
  2. HomeButton : Flies the viewer back to a default view.
  3. SceneModePicker : Switches between 3D, 2D and Columbus View (CV) modes.
  4. BaseLayerPicker : Chooses the imagery and terrain to display on the globe.
  5. NavigationHelpButton : Displays the default camera controls.
  6. Animation : Controls the play speed for view animation.
  7. CreditsDisplay : Displays data attributions. Almost always required!
  8. Timeline : Indicates current time and allows users to jump to a specific time using the scrubber.
  9. FullscreenButton : Makes the Viewer fullscreen.

翻译

  1. Geocoder : 一种地理位置搜索工具,用于显示相机访问的地理位置。默认使用微软的Bing地图。
  2. HomeButton : 首页位置,点击之后将视图跳转到默认视角。
  3. SceneModePicker : 切换2D、3D 和 Columbus View (CV) 模式。
  4. BaseLayerPicker : 选择三维数字地球的底图(imagery and terrain)。
  5. NavigationHelpButton : 帮助提示,如何操作数字地球。
  6. Animation :控制视窗动画的播放速度。
  7. CreditsDisplay : 展示商标版权和数据源。
  8. Timeline : 展示当前时间和允许用户在进度条上拖动到任何一个指定的时间。
  9. FullscreenButton : 视察全屏按钮。

我们可以通过代码来配置视窗组件,在我们初始化视窗的时候,通过配置参数添加/移除相关组件。 以下代码是通过参数配置得到的viewer,该Viewer不带selection indicators, base layer picker or scene mode picker等组件。

var viewer = new Cesium.Viewer('cesiumContainer', {    scene3DOnly: true,    selectionIndicator: false,    baseLayerPicker: false});

如果需要查看Viewer的完整配置,请查看:

Cesium中文网交流QQ群:807482793

Cesium中文网: | 国内快速访问:

转载于:https://my.oschina.net/u/1470240/blog/1932096

你可能感兴趣的文章
springSecurity配置详解
查看>>
解决VIM中文乱码的一次经历
查看>>
菜鸟学Linux 第101篇笔记 tomcat基本原理
查看>>
php7安装----
查看>>
VNX NETAPP NAS 备份恢复
查看>>
HashMap的存储原理
查看>>
2007年最強的电脑喇叭和耳机升級 马上拥有百万級SRS专利技术 [中文增強版]
查看>>
高可用集群之分布式文件系统(续一)
查看>>
ansible(续一)
查看>>
SSH,SCP,SFTP命令汇总
查看>>
#26 Linux kernel(内核)详解与uname、lsmod、modinfo、depmod、insmod、rmmod、modprobe...命令用法...
查看>>
数组和指针关系的探讨
查看>>
HDFS应用开发篇
查看>>
RMAN 内存利用介绍: PGA 以及SGA
查看>>
Java开发的利器: 反编译工具 JD-GUI
查看>>
mac配置pep8
查看>>
一次故障转移的排错
查看>>
LNMP—Nginx的用户认证
查看>>
分享一个生产环境中利用SVN上线代码的脚本
查看>>
自动安装nginx
查看>>