CesiumJS目录结构
2019-03-04 10:50:50 来源:admin 点击:1008
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);
操作步骤
打开Source/App.js,删除contents
拷贝Source/AppSkeleton.js到Source/App.js
确认server.js在Cesium文件夹根目录,并运行server.js (npm server.js)
在新版本(支持WebGL)的浏览器中输入localhost:8080
如果有任何问题: