cesium入门1
本教程将获得所有技能水平的开发人员和他们的第一个铯应用程序运行。
验证Cesium在您的Web浏览器中工作的最简单的方法是单击此处运行Hello World示例 （打开一个新窗口）。如果你看到像下面的图像，恭喜你的系统可以运行铯，你可以安全地跳到下一部分; 否则，继续阅读。
Cesium是基于几种新的HTML5技术构建的，其中最重要的是WebGL。即使这些新标准很快被广泛采用，一些浏览器和系统需要更新以支持它们。如果示例应用程序不适合您，请尝试以下几种方法。
- 更新您的网络浏览器。大多数Cesium团队使用Google Chrome，但Firefox，Internet Explorer 11和Opera也可以使用。如果您已经在使用上述其中一种浏览器，请确保更新到最新版本。
- 更新您的显卡驱动程序以更好地支持3D。如果您知道您的视频卡类型，您可以检查供应商网站的更新。三个最受欢迎的是：Nvidia，AMD和英特尔。
- 如果您仍遇到问题，请尝试访问http://get.webgl.org/，其中提供了其他问题排查建议。您也可以在Cesium论坛上寻求帮助。
选择编辑器或IDE
如果你已经是一个经验丰富的开发人员，你很可能有一个最喜欢的编辑器或开发环境; 例如，大多数铯团队使用Eclipse。如果你刚刚开始，一个伟大的免费和开源的编辑器是Notepad ++，你可以从他们的网站下载。最终任何文本编辑器都会做，所以去与你最舒适的。
下载铯释放
假设你还没有这样做，点击这个按钮抓住最新的铯释放： Cesium-1.30.zip
下载后，将zip文件解压到您选择的新目录中，我将在整个教程中将此文件称为Cesium root目录。内容应该看起来像下面。
它可能是诱人的双击index.html，但我们只会有失望的欢迎。为了使应用程序实际工作，它需要在Web服务器中运行。
为了运行Cesium应用程序，我们需要一个本地Web服务器来托管我们的文件。我们将使用Node.js来完成这个和其他教程。如果你已经有一个你想要使用的Web服务器，这也很好，只要确保托管我们在上一节中创建的根目录。铯没有服务器要求; 它完全是客户端。这意味着任何可以托管静态内容的Web服务器也可以托管Cesium。
使用Node.js设置Web服务器很容易，只需要3个步骤。1.从其网站安装Node.js ，可以使用默认安装设置。2.在Cesium根目录中打开命令shell，然后通过执行下载/安装所需的模块npm install。这将在根目录中创建一个“node_modules”目录。3.最后，通过node server.js在根目录中执行启动Web服务器。你应该看到类似下面的东西
你好（再次）世界！
现在我们已经启动并运行了一个Web服务器，我们可以启动浏览器并导航到http：// localhost：8080 / Apps / 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>
这些是需要添加铯到应用程序的四行：
第一步是
Cesium.js在脚本标记中包含。这定义了Cesium对象，其中包含我们需要的一切。<script src="../Build/Cesium/Cesium.js"></script>
为了使用Cesium Viewer小部件，我们需要包括它的CSS。
@import url(../Build/Cesium/Widgets/widgets.css);
在HTML体中，我们创建一个div，供查看器生活。
<div id="cesiumContainer"></div>
最后，我们创建一个viewer的实例。
var viewer = new Cesium.Viewer('cesiumContainer');
恭喜，您已经启动并运行Cesium并准备开始编写自己的铯应用程序和网页。根据学习者的类型，您可能有兴趣查看其他教程，介绍主要的铯功能。如果你是一个tinkerer，那么Cesium Sandcastle是一个现场编码应用程序，它将允许你不仅查看几十个示例，而且查看和编辑它们的源代码，从应用程序中更新更改。最后，无论您如何学习，参考文档包含API的详细信息，是每个人的宝贵资源。
cesium入门1的更多相关文章
- cesium 入门开发系列地图鹰眼功能(附源码下载)
前言 cesium 入门开发系列环境知识点了解:cesium api文档介绍,详细介绍 cesium 每个类的函数以及属性等等cesium 在线例子 内容概览 cesium 结合 leaflet 实现 ...
- cesium 入门开发系列矢量瓦片加载展示(附源码下载)
前言 cesium 入门开发系列环境知识点了解:cesium api文档介绍,详细介绍 cesium 每个类的函数以及属性等等cesium 在线例子 内容概览 cesium 实现矢量瓦片加载效果 源代 ...
- cesium入门示例-测量工具
作为cesium入门示例级别的最后一篇,参考cesium-长度测量和面积测量实现测量工具封装,修改了其中的距离测量函数,计算贴地距离,并对事件内部处理做了调整.包括贴地距离测量.面积测量.结果清除. ...
- cesium入门示例-矢量化单体分类
实现楼层的分层选择和属性信息展示,该功能基于大雁塔倾斜数据实现单体化分类显示. 数据准备: 1.大雁塔倾斜数据,已转换为3dTiles,参考cesium入门示例-3dTiles加载的第2节osgb数据 ...
- Cesium入门13 - Extras - 附加内容
Cesium入门13 - Extras - 附加内容 Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ 剩下的代码 ...
- Cesium入门12 - Camera Modes - 相机模式
Cesium入门12 - Camera Modes - 相机模式 Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ ...
- Cesium入门11 - Interactivity - 交互性
Cesium入门11 - Interactivity - 交互性 Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ ...
- Cesium入门9 - Loading and Styling Entities - 加载和样式化实体
Cesium入门9 - Loading and Styling Entities - 加载和样式化实体 Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://c ...
- Cesium入门10 - 3D Tiles
Cesium入门10 - 3D Tiles Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ 我们团队有时把Ces ...
- Cesium入门8 - Configuring the Scene - 配置视窗
Cesium入门8 - Configuring the Scene - 配置视窗 Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coini ...
随机推荐
- ccTouchBegan
CCLayer中的setTouchEnabled(true)会开启多点触摸. 如果使用CCDirector::sharedDirector()->getTouchDispatcher()-> ...
- ARM GNU常用汇编语言介绍
ARM GNU常用汇编语言介绍 ARM汇编语言源程序语句,一般由指令,伪操作,宏指令和伪指令组成. ARM汇编语言的设计基础是汇编伪指令,汇编伪操作和宏指令. 伪操作,是ARM汇编语言程序里的一些特殊 ...
- 如何在WebService中重载方法
1. 本来在WebService中这样写的重载方法,如下所示: [WebService(Namespace = "http://tempuri.org/")] [WebSer ...
- USB 转LAN AX88772B 模块驱动添加记录
使用 AX88772B 模块进行扩展百兆网口. 资料地址: http://www.asix.com.tw/cs/products.php?op=pItemdetail&PItemID=105; ...
- OpenWRT中的按键和灯的GPIO控制实现
基于BarrierBreaker版本,基于AR9331 AP121 Demo单板 来进行描述 1.灯 A.在mach-ap121.c中,定义了灯所对应的GPIO定义: #define AP121_GP ...
- Bit operator: Left shift and Right shift (Signed or unsigned? )
No matter left shift or right shift, the result's sign should always be the same as its left operand ...
- 内网环境NTP服务及时间同步(CentOS6.x)配置和部署
目标环境,5台linux centos 6.3, 一台作为NTPD服务与外部公共NTP服务同步时间,同时作为内网的NTPD服务器,其他机器与这台服务做时间同步. 服务器IP 角色 说明 同步方式 ...
- MVC教程一：MVC简介
一.概述 1.MVC是一种流行的Web应用架构技术,他把Web应用划分成Model(模型).Controller(控制器)和View(视图)三部分. 2.优点:可测试.可维护 3.MVC是ASP.NE ...
- debian配置网络
http://blog.csdn.net/ypist/article/details/8513274 vim /etc/resolv.conf 配置域名服务器 search test.ivic.o ...
- 数据导入报错 Got a packet bigger than‘max_allowed_packet’bytes
数据导入报错:Got a packet bigger than‘max_allowed_packet’bytes的问题 2个解决方法: 1.临时修改:mysql>set global max_a ...