Cesium入门7 - Adding Terrain - 添加地形

Posted 2023-04-15

参考技术A

Cesium中文网： http://cesiumcn.org/ | 国内快速访问： http://cesium.coinidea.com/

Cesium支持流式的、可视化的全球高程投影地形地势、水形数据，包括海洋、湖泊、河流、山峰、峡谷和其他能够被三维展示出来的且效果比二维好的地形数据。像图层数据一样，Cesium引擎会从一个服务器上请求流式地形数据，仅请求那些基于当前相机能看到的需要绘制的图层上的数据。

Cesium官方提供了一些地形数据集的例子，以及如何配置这些参数。

支持的地形数据格式

为了添加地形数据，我们需要创建一个 CesiumTerrainProvider ，提供一个url和一些配置想，然后将这个provider赋值给 viewer.terrainProvider 。

此处，我们使用 Cesium WorldTerrian 图层，该图层由Cesium ion提供，在“My Assets”中是默认提供的。我们可以用 createWorldTerrain helper函数创建一个由Cesium ion提供服务的 Cesium WorldTerrian 。

requestWaterMask 和 requestVertexNormals 是可选的配置项，告诉Cesium是否需要请求额外的水、光数据。这两个选项默认是设为false的。

最终，既然我们有了地形数据，我们需要更多的线条来使得地形数据背后的objects能够正确地显示，只有最前面、最上面的objects才能是可见的。

我们现在有地形数据和运动的水。纽约非常平坦，所以可以在上面的地形数据上自由的探索。举一个显而易见的例子，你可以跳转到更加崎岖的区域比如 Grand Canyon 或者 San Francisco。

关于地形数据的更多信息，请访问 Terrain Tutorial

Cesium中文网交流QQ群：807482793

Cesium中文网： http://cesiumcn.org/ | 国内快速访问： http://cesium.coinidea.com/

cesium编程入门环境搭建

环境搭建

环境搭建 编译

node 安装

Node.js安装包及源码下载地址为：https://nodejs.org/en/download/。

安装完成后，打开命令行，输入:node -v,如果结果为版本号,表明安装成功

 $ node -v
 v6.10.3

cnpm 设置

国内使用npm时有时速度很慢，推荐使用cnpm替代，使用方法和npm一样，链接：淘宝 NPM 镜像

$ npm install -g cnpm --registry=https://registry.npm.taobao.org
$ cnpm -v
[email protected] (/usr/local/lib/node_modules/cnpm/lib/parse_argv.js)
[email protected] (/usr/local/lib/node_modules/cnpm/node_modules/npm/lib/npm.js)
[email protected] (/usr/local/bin/node)
[email protected] (/usr/local/lib/node_modules/cnpm/node_modules/npminstall/lib/index.js)
prefix=/usr/local
darwin x64 17.2.0
registry=http://registry.npm.taobao.org

Cesium代码

1. 下载官方包 地址，由于总所周知的原因，速度很感人

2. 百度云链接 密码: 9g73 版本1.40

3. 如果想了解最新的进展可以直接克隆 github 上的代码 github地址，
   注意有些特性在分支版本里面才有，
   

获取安装包之后

1. 解压
2. 打开命令行，进入当前目录
3. 安装依赖，输入:cnpm install,等待安装完成，然后输入: node server.js

$ cd ./Cesium-1.40
$ cnpm install
 ...
 Installed 37 packages
 Linked 569 latest versions

$ node server.js
Cesium development server running locally.  Connect to http://localhost:8080/

打开浏览器，输入 http://localhost:8080/ (浏览器必须支持webgl，推荐使用chrome)
如果出现

1. 到这里，环境搭建完成。

推荐使用编辑器

如果单纯的学习如何使用的话，使用http://localhost:8080/Apps/Sandcastle/index.html应该就够了，如果要使用编辑器的话，推荐使用vscode.

使用说明

环境搭建好之后，输入 http://localhost:8080/ 有两个链接非常重要

Documentation

Sandcastle

Documentation

里面是Cesium的完整的API说明，里面可以找到：

• 某一个模块的所有函数，属性
• 部分效果截图
• 部分函数，属性调用代码示例

缺点：搜索功能不够强大

Sandcastle

这个就厉害了，是一个沙盒，你可以在里面

• 浏览当前版本的一些功能特性
• 一个可运行的代码库
• 新建一个页面，进行代码测试
• 导出测试代码
• ...

推荐的学习方式

1. 先浏览一遍沙盒里的所有示例，Cesium能做什么，做成什么样，心里有数
2. 做自己需要的功能时，查找到相关示例代码，弄懂，最好浏览一遍用到的模块的API
3. 如果是深入研究的话，就需要有对WebGL有更深层次的了解
4. 用它做自己感兴趣的项目。。。