Cesium(一)、第一个cesiumjs应用

1、cesium简介
cesiumjs是一个基于javascript的、开源的,二、三维地图开发库。CesiumJS官网地址为:https://cesiumjs.org。示例程序的地址为 :https://sandcastle.cesium.com/。
历史版本和更新日志:https://cesium.com/downloads/cesiumjs/
cesiumion是cesiumjs官方云服务器,用于上传自己的数据,并可以在里面发布成服务。 官网地址为:https://cesium.com/ion/signin/。 有时候访问bing地图等数据时,需要在cesiumion中获取token.
2、cesiumjs下载
在官网下载cesiumjs源代码,地址: https://github.com/AnalyticalGraphicsInc/cesium/releases 。 下载后的目录结构入下图:
Cesium(一)、第一个cesiumjs应用_第1张图片
Build: cesiumjs压缩后的包
Source: cesiumjs源代码包
ThiedParty: 外部js库,目前只包含cesium。
index.html: 主页,包含项目程序代码和页面结构。
server.js: 简单的基于nodejs的http服务器。
3、开发第一个cesiumjs应用程序
将Build文件夹整个文件夹拷贝到你的项目下,新建一个html页面,引入Cesium.js和widgets.css。为cesium的控件viewer创建div.
Cesium(一)、第一个cesiumjs应用_第2张图片
Cesium的最基础对象就是 Viewer,viewer是一个具有很多功能的3d地球容器. 使用下面的代码创建viewer并绑定到id为 “cesiumContainer”`的div上。一个简单的cesium程序就完成了。默认加载的bing地图。
在这里插入图片描述
ps:webGL出于安全性的考虑,不允许用本地flie的形式打开文件,所以cesium程序的运行需要服务器环境。在项目下创建并运行一个简单http-serve(以widonws环境为例):
①、全局安装http-server(默认已经有node环境)
npm install http-server -g
②、在项目文件夹运行http-server
shift+鼠标右键打开PowerShell窗口,输入http-server启动服务器,在localhost:8082地址下访问cesium程序

Cesium(一)、第一个cesiumjs应用_第3张图片

运行成功的结果如下图:

你可能感兴趣的:(Cesium开发)