app 目录

下载官网上的文件，我们能看到以下 CesiumJS 库结构：

• Source/: Cesium 应用程序代码及数据
• ThirdParty/：外部依赖库，不同于 Cesium 的第三方库
• LICENSE.md：Cesium 的 License 介绍
• index.html：Web 首页，需要按照 Cesium 要求定义页面，同时添加 Cesium 依赖库
• server.js：基于 node.js 的 web 服务应用

备注

cesiumJS 与第三方 JavaScript 库和框架做了适配:

React: Integrating Cesium with React

ThreeJS: Integrating Cesium with ThreeJS

页面结构

引入 CesiumJS

<script src="ThirdParty/Cesium/Cesium.js"></script>

开发者也可以根据自己的需求，通过 ThirdParty/Cesium/source/ 来挑选自己的依赖库，裁剪 js 的大小，

HTML 结构

需要一个 div 作为 Cesium Viewer widget 的容器

<div id="cesiumContainer"></div>

需要引入 app.js 来激活 Cesium Viewer，app.js 最好在 HTML 末尾引入。

<script src="Source/App.js"></script>

添加 CSS 样式

需要引入 Cesium viewer 中的各种 widget 的样式
新建一个 index.css，并引入到 index.html 中

<link rel="stylesheet" href="index.css" media="screen">

在 index.css 中加入以下默认的 Cesium CSS。

@import url(ThirdParty/Cesium/Widgets/widgets.css);

操作步骤

1. 打开 Source/App.js，删除 contents
2. 拷贝 Source/AppSkeleton.js 到 Source/App.js
3. 确认 server.js 在 Cesium 文件夹根目录，并运行 server.js (npm server.js)
4. 在新版本（支持 WebGL）的浏览器中输入 localhost:8080

如果有任何问题：

完整代码：https://cesiumjs.org/Cesium/B…

推荐代码：https://cesiumjs.org/Cesium/B…

Cesium 中文网交流 QQ 群：807482793

本文由 admin 创作，采用 知识共享署名 3.0 中国大陆许可协议 进行许可。
可自由转载、引用，但需署名作者且注明文章出处。