cesium 知乎_Cesium入门4 – 创建Cesium Viewer

超、凢脫俗 2022-10-24 06:12 383阅读 0赞

任何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自带了一些有用的组件：

Geocoder : A location search tool that flies the camera to queried location. Uses Bing Maps data by default.

HomeButton : Flies the viewer back to a default view.

SceneModePicker : Switches between 3D, 2D and Columbus View (CV) modes.

BaseLayerPicker : Chooses the imagery and terrain to display on the globe.

NavigationHelpButton : Displays the default camera controls.

Animation : Controls the play speed for view animation.

CreditsDisplay : Displays data attributions. Almost always required!

Timeline : Indicates current time and allows users to jump to a specific time using the scrubber.

FullscreenButton : Makes the Viewer fullscreen. 翻译

Geocoder : 一种地理位置搜索工具，用于显示相机访问的地理位置。默认使用微软的Bing地图。

HomeButton : 首页位置，点击之后将视图跳转到默认视角。

SceneModePicker : 切换2D、3D 和 Columbus View (CV) 模式。

BaseLayerPicker : 选择三维数字地球的底图(imagery and terrain)。

NavigationHelpButton : 帮助提示，如何操作数字地球。

Animation :控制视窗动画的播放速度。

CreditsDisplay : 展示商标版权和数据源。

Timeline : 展示当前时间和允许用户在进度条上拖动到任何一个指定的时间。

FullscreenButton : 视察全屏按钮。

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

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

发表评论取消回复

表情：

评论列表（有 0 条评论，383人围观）

还没有评论，来说两句吧...

相关阅读

相关 cesium学习——cesium中的坐标

一、坐标展现形式　　在cesium中，对于坐标数值单位有三种：角度、弧度和坐标值　　1.角度　　　　角度就是我们所熟悉的经纬度，对于地球的坐标建立如下：　　　　

r囧r小猫/ 2023年08月17日 17:24/ 0 赞/ 159 阅读

相关 [three][cesium] | 使用three渲染cesium地球瓦片

基于了cesium的四叉树调度地形影像数据，使用three构建球体和mesh瓦片并渲染，在每一帧渲染的时候更新frameState所需的参数。目前已经实现大概的加载流程还有

旧城等待，/ 2023年01月16日 03:19/ 0 赞/ 207 阅读

相关 cesium 相机跟随

一场大的台风，路径通常很长，可能从靠近赤道的太平洋一直往北吹到东三省。跨度这么大，在三维GIS中，往往不容易看全。如果能够实现相机随动效果，即相机跟随台风步进、移动，就生动许多

素颜马尾好姑娘i/ 2022年12月02日 15:10/ 0 赞/ 674 阅读

相关 cesium初始化

洒家接触cesium不久，从现在开始要陆续记录下心得。年纪大了，脑细胞成片成片地死亡，快成S逼了。一般来说，我们应用个什么东西，都不会老老实实地采用默认值，一定会折腾一下才

一时失言乱红尘/ 2022年11月25日 10:29/ 0 赞/ 145 阅读

相关 cesium 知乎_Cesium入门4 – 创建Cesium Viewer

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

超、凢脫俗/ 2022年10月24日 06:12/ 0 赞/ 384 阅读

相关 [cesium] | 结合Cesium的点云+全景展示

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhp

矫情吗；*/ 2022年10月09日 06:25/ 0 赞/ 756 阅读

相关 Vue+Cesium

VUE 一、安装node环境 1. [官方网址][Link 1] 建议下载长期稳定版本 2. 检查安装是否成功打开cmd命令行

Bertha 。/ 2022年03月16日 05:44/ 0 赞/ 759 阅读

相关 cesium入门笔记集合

目录标题一、认识Cesium 概念作用二、环境建立应用程序目录

比眉伴天荒/ 2022年03月15日 11:16/ 0 赞/ 1320 阅读

相关【Cesium】天空盒子

![37018-20181121143524851-1693052264.png][] skyBox: new Cesium.SkyBox(\{ sources: \{

我就是我/ 2021年09月30日 13:28/ 0 赞/ 757 阅读

相关 vue 2.x+webpack+cesium1.64详解（2）：创建 Cesium Viewer

目录一、Viewer介绍二、生成一Viewer 三、Viewer配置 3.1 Viewer默认鼠标和滚轮事件 3.2 默认Viewer自带的组件 3.3

喜欢ヅ旅行/ 2021年07月24日 20:36/ 0 赞/ 573 阅读