Cesium简介 [转]
http://www.cnblogs.com/laixiangran/p/4984522.html
一、Cesium介绍

Cesium是国外一个基于JavaScript编写的使用WebGL的地图引擎。Cesium支持3D,2D,2.5D形式的地图展示,可以自行绘制图形,高亮区域,并提供良好的触摸支持,且支持绝大多数的浏览器和mobile。
二、Cesium特点
1、一个API - 三种视图

Cesium支持三维地球(3D),二维地图(2D)以及2.5D哥伦布视图(2.5D)。

2、动态地理空间数据的可视化

通过CZML创建数据驱动的时间动态场景。
高分辨率的世界地形可视化。
使用WMS,TMS,openstreetmaps,Bind以及ESRI的标准绘制影像图层。
使用KML,GeoJSON和TopoJSON绘制矢量数据。
使用COLLADA和glTF绘制3D模型。
使用插件扩展核心Cesium。
3、内置的高性能和高精度

- 优化的WebGL,充分利用硬件渲染图形,使用低级别的几何和渲染程序。
- 绘制大范围的折线,多边形,广告牌,标签,挤压以及走廊。
- 控制摄像头和创造飞行路径。
- 使用动画控件控制动画时间。
三、Cesium示例
以下将示例如何运行一个Cesium应用程序:
1、确保浏览器支持Cesium
验证Cesium在Web浏览器中工作的最简单方法是运行HelloWorld例子,点击这里。如果你看到一些像下面的图片,恭喜你,你运行的该Web浏览器支持运行Cesium,那么你可以跳到下一部分阅读;否则,继续阅读。

Cesium是建立在几个新的HTML5技术之上的,其中最重要的是WebGL。虽然这些新的标准正在迅速成为广泛采用,但一些浏览器和系统需要升级从而支持他们。如果示例应用程序允许失败,你可以尝试以下的建议:
(1)更新您的Web浏览器。大多数的Cesium团队使用Google Chrome,但Firefox,IE 11以及Opera也能运行。如果你正在用这些浏览器,请确保更新它到最新版本。
(2)更新您的显卡驱动从而更好地支持3D。如果你知道你正用的是什么类型的显卡,你可以检查进行更新。三个最流行的显卡提供商是:Nvidia, AMD以及 Intel。
(3)如果你仍然有问题,尝试访问http://get.webgl.org/,它提供了额外的问题解决建议。你也可以在Cesium论坛寻求帮助。
2、选择编辑器或IDE
如果你已经是一个经验丰富的开发者,你很可能会有一个最喜爱的编辑器和开发环境;例如,大多数的Cesium的团队使用日蚀。如果你刚刚开始,一个伟大的自由和开放源码编辑器,记事本++,你可以从网上下载他们的网站。最终,任何文本编辑器会做的,所以去一个你最舒服。
3、下载Cesium
如果你还没有这样做,点击这个按钮来获取最新的Cesium:下载Cesium。
下载完成之后将zip文件解压到你选择的新目录,解压之后文件目录类似于下图。

不能直接双击运行index.html,在实际工作中,它需要运行在Web服务器上。
4、设置Web服务器
为了运行Cesium的应用,我们需要一个本地Web服务器的主机文件。我们所有的例子将使用Node.js。当然你也可以使用自己的服务器,只要把上一节的目录放在服务器根目录下。
设置一个Web服务器通过Node.js是很容易的,只需要3个步骤:
(1)从安装Node.js网站,你可以使用默认安装设置。
(2)打开命令行,然后进入Cesium的根目录,通过npm install下载安装所需要的模块。
最后,在根目录执行node server.js启动Web服务器。
(3)此时您将看到下图:

5、运行Hello world!
现在我们的Cesium已经运行在Web服务器上,我们可以启动Web浏览器并输入网址http://localhost:8080/HelloWorld.html。这与我们刚开始测试WebGL时看到的Hello
World应用程序是一样的,但现在是运行在你自己的系统中,而不是在Cesium网站上。如果我们在编辑器中打开helloworld.html,我们会看到以下代码:

<!DOCTYPE html>
<html lang="en">
<head>
<!-- Use correct character set. -->
<meta charset="utf-8">
<!-- Tell IE to use the latest, best version. -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Make the application on mobile take up the full browser screen and disable user scaling. -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<title>Hello World!</title>
<script src="../Build/Cesium/Cesium.js"></script>
<style>
@import url(../Build/Cesium/Widgets/widgets.css);
html, body, #cesiumContainer {
width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;
}
</style>
</head>
<body>
<div id="cesiumContainer"></div>
<script>
var viewer = new Cesium.Viewer('cesiumContainer');
</script>
</body>
</html>

以下四行将添加到你的应用程序中:
(1)引入cesium.js。该文件定义了Cesium对象,它包含了我们需要的一切。
<script src="../Build/Cesium/Cesium.js"></script>
(2)为了能使用Cesium各个可视化控件,我们需要引入widgets.css。
@import url(../Build/Cesium/Widgets/widgets.css);
(3)在HTML的body中我们创建一个DIV,用来作为三维地球的容器。
<div id="cesiumContainer"></div>
(4)最后,在js中初始化CesiumViewer实例。
var viewer = new Cesium.CesiumViewer('cesiumContainer');
6、接下来干嘛
通过以上的学习,恭喜你,你已经开始写你自己的Cesium应用和网页了。那么根据自己的情况,你可能对其他Cesium教程感兴趣。如果你是一个新手,通过Cesium Sandcastle这个编码的应用,您不仅可以查看几十个实例,也可以查看和编辑自己的源代码,从应用程序中运行查看你的改变。最后,无论你如何学习,参考文献对每个人来说都是一个非常宝贵的资源。
Cesium开发实践汇总 http://www.cnblogs.com/laixiangran/p/4985403.html
cesium随笔 — 获取当前鼠标的经度、纬度、高度 http://www.cnblogs.com/laixiangran/p/4999961.html
cesium随笔 — 隐藏三维场景下方版权信息http://www.cnblogs.com/laixiangran/p/5000028.html
cesium调用天地图服务 http://www.cnblogs.com/laixiangran/p/5049198.html
cesium随笔 — 简单实现获取三维范围(包括相机高度) http://www.cnblogs.com/laixiangran/p/5165674.html
Cesium Language (CZML) 入门1 — CZML Structure(CZML的结构) http://www.cnblogs.com/laixiangran/p/4997971.html
Cesium Language (CZML) 入门2 — CZML Content(CZML的内容) http://www.cnblogs.com/laixiangran/p/4998529.html
Cesium简介 [转]的更多相关文章
- Cesium简介以及离线部署运行
Cesium简介 cesium是国外一个基于JavaScript编写的使用WebGL的地图引擎,一款开源3DGIS的js库.cesium支持3D,2D,2.5D形式的地图展示,可以自行绘制图形,高亮区 ...
- Cesium简介
一.Cesium介绍 Cesium是国外一个基于JavaScript编写的使用WebGL的地图引擎.Cesium支持3D,2D,2.5D形式的地图展示,可以自行绘制图形,高亮区域,并提供良好的触摸支持 ...
- cesium编程入门(一)cesium简介
cesium编程入门 cesium是什么 Cesium 是一个跨平台.跨浏览器的展示三维地球和地图的 javascript 库. Cesium 使用WebGL 来进行硬件加速图形,使用时不需要任何插件 ...
- Cesium 之简介以及离线部署运行篇
前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材. C ...
- Cesium基础使用介绍
前言 最近折腾了一下三维地球,本文简单为大家介绍一款开源的三维地球软件--Cesium,以及如何快速上手Cesium.当然三维地球重要的肯定不是数据显示,这只是数据可视化的一小部分,重要的应该是背后的 ...
- Cesium学习2:如何从零开始在Eclipse IDE,Java语言搭建cesium开发环境
废话不多说,今天就先在Eclipse上搭建Cesium开发环境吧~ 零.Cesium简介 Cesiumjs 是一套javascript库,用来渲染3D地球,2D区域地图,和多种GIS要素.不需要安装任 ...
- Cesium学习1:如何在本机的Apache tomcat9.0.8服务器中打开cesium的index.html页面
Cesium的官方网站:https://cesiumjs.org/ 点击这个按钮来获取最新的Cesium:下载Cesium. 下载完成之后将zip文件解压到你选择的新目录,解压之后文件目录类似于下图. ...
- 局域网Cesium离线影像及瓦片影像地图加载【转】
http://www.mamicode.com/info-detail-2161992.html 1.Cesium简介 优点: cesium展示地图数据效果比较好,解析2D地图各种不同服务类型的数据源 ...
- 【转载】Cesium基础使用介绍
既然给我发了参与方式,不参加似乎有点不给人面子,反正也没多少人看我的博客,那我就试试吧,也欢迎大家自己参与:2017年度全网原创IT博主评选活动投票:http://www.itbang.me/goVo ...
随机推荐
- ios - 设置一个VC的navigationController的显示图案或文字,其他navigationController依旧不变
1. override func viewDidLoad() { super.viewDidLoad() self.navigationController?.delegate = self } 2. ...
- java 错误: 找不到或无法加载主类
这个问题应该很常见的,笔者经常手工编译一些测试代码或者小工具,经常用到 javac和java来编译并运行一些简单的小工具. 以Hello World来测试. HelloWorld.java publi ...
- NABCD模型--软件工程
1.N (Need 需求) 我们通过网络调查问卷的方式,收集样本数据,并对其进行分析和总结. 1.你是否为在校学生? 7.如果用过,你觉得还应该需要添加什么功能 通过调查发现,大多数学生并不是特别了解 ...
- php调java接口
1.下载二进制的 JavaBridge.jar包.java/Java.inc库文件,下载地址:http://php-java-bridge.sourceforge.net/pjb/download.p ...
- apicloud代码压缩和全局加密
首先说代码压缩,因为没什么用,就先说它了.代码压缩后,apicloud里面的css和js文件里面的空格呀回车呀都去掉了,就是文件小了,所有代码显示为一行了.这些代码的变量没有重命名,我们知道jquer ...
- 2018秋季C语言基础课第1次作业
1.翻阅邹欣老师博客关于师生关系博客,并回答下列问题: 1)大学和高中最大的不同是没有人天天看着你,请看大学理想的师生关系是?有何感想? 答:是 Coach / Trainee (健身教练 / 健身 ...
- jquery统计显示或隐藏的元素个数
统计显示的checkbox的数量: 统计隐藏的checkbox数量:
- 2018.08.27 [Usaco2017 Jan]Promotion Counting(线段树合并)
描述 The cows have once again tried to form a startup company, failing to remember from past experienc ...
- 微信第三方平台解密报错:Illegal key size
今天在交接别人代码的时候遇到的,微信第三方平台解密报的错误,原因: 如果密钥大于128, 会抛出java.security.InvalidKeyException: Illegal key size ...
- IoC的基本概念
一.什么是IOC ioc是一个英文缩写,英文全称是 Inversion of Control,翻译过来是“控制反转”.理解好Ioc的关键是要明确“谁控制谁,控制了什么,为何是反转,哪些方面反转了” 谁 ...