原文地址:https://cesium.com/docs/tutorials/getting-started/

学会使用全球地形、影像、3d tile(模型切片)、地理编码创建一个Cesium程序。

CesiumJS是一个基于javascript的浏览器器3d地图引擎。Cesium ion是一个3d内容的发布中心并且可以把你自己的数据进行切片、发布服务。CesiumJS和 ion 配合起来可以创建世界级3d地图程序。

 
3D数据经过ion或者cesiumlab进行处理,并且在cesiumjs中可视化.

第一个程序
代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://cesiumjs.org/releases/1.51/Build/Cesium/Cesium.js"></script>
<link href="https://cesiumjs.org/releases/1.51/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
</head>
<body>
<div id="cesiumContainer" style="width: 700px; height:400px"></div>
<script>
Cesium.Ion.defaultAccessToken = 'your_access_token';
var viewer = new Cesium.Viewer('cesiumContainer');
</script>
</body>
</html>

注意:

如果你登陆cesium ion之后,可以用你自己的access token 替换代码里的。

所有web程序需要一个web服务器,CesiumJS也不例外。为了简单,这个教程跳过本地服务器的搭建,使用Glitch 和 一个在线的IDE做程序开发。点击这里创建一个glitch项目。Glitch加载之后,忽略模板提示,直接点击index.html 删除整个内容,把上面的代码粘贴过去。

点击

 
 

按钮,它会打开一个新窗口,并显示了Cesium的程序。修改代码后,这个弹出窗口会自动刷新。

 
Glitch预览界面

代码分析:

在HTML的head标签内包含CesiumJS的库引用

<script src="https://cesiumjs.org/releases/1.51/Build/Cesium/Cesium.js"></script>
<link href="https://cesiumjs.org/releases/1.51/Build/Cesium/Widgets/widgets.css" rel="stylesheet">

创建一个HTML标签去承载CesiumJS控件(widget):

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

从你的ion账户提供一个token去访问Bing影像底图:

Cesium.Ion.defaultAccessToken = 'your_access_token';

最后,创建一个名为Viewer的Cesium控件,并且让他去使用上面定义的HTML元素:

var viewer = new Cesium.Viewer('cesiumContainer');

添加Cesium全球地形
Cesium全球地形是一个高精度地形库,在你的ion账户里已经有访问权限。用下述代码替换我们做的第一个示例里的创建Viewer的部分:

var viewer = new Cesium.Viewer('cesiumContainer', {
terrainProvider: Cesium.createWorldTerrain()
});

下来我们在预览界面缩放到特定位置,比如“Grand Canyon, AZ”,就看到如下图效果:

 
Grand Canyon的10米精度地形
 
中国最专业的Cesium开发者社区

Ceisum官方教程1 -- 开始的更多相关文章

  1. Ceisum官方教程2 -- 项目实例(workshop)

    原文地址:https://cesiumjs.org/tutorials/Cesium-Workshop/ 概述 我们很高兴欢迎你加入Cesium社区!为了让你能基于Cesium开发自己的3d 地图项目 ...

  2. Ceisum官方教程3 -- 空间数据可视化

    原文地址:https://cesiumjs.org/tutorials/Visualizing-Spatial-Data/ 这篇教程教你如何使用Cesium的Entity API去绘制空间数据,如点, ...

  3. Unity性能优化(3)-官方教程Optimizing garbage collection in Unity games翻译

    本文是Unity官方教程,性能优化系列的第三篇<Optimizing garbage collection in Unity games>的翻译. 相关文章: Unity性能优化(1)-官 ...

  4. Unity性能优化(4)-官方教程Optimizing graphics rendering in Unity games翻译

    本文是Unity官方教程,性能优化系列的第四篇<Optimizing graphics rendering in Unity games>的翻译. 相关文章: Unity性能优化(1)-官 ...

  5. Unity性能优化(2)-官方教程Diagnosing performance problems using the Profiler window翻译

    本文是Unity官方教程,性能优化系列的第二篇<Diagnosing performance problems using the Profiler window>的简单翻译. 相关文章: ...

  6. Unity性能优化(1)-官方教程The Profiler window翻译

    本文是Unity官方教程,性能优化系列的第一篇<The Profiler window>的简单翻译. 相关文章: Unity性能优化(1)-官方教程The Profiler window翻 ...

  7. jeecg表单页面控件权限设置(请先看官方教程,如果能看懂就不用看这里了)

    只是把看了官方教程后,觉得不清楚地方补充说明一下: 1. 2. 3. 4.用"jeecgDemoController.do?addorupdate"这个路径测试,不出意外现在应该可 ...

  8. [转]Google Guava官方教程(中文版)

    Google Guava官方教程(中文版) http://ifeve.com/google-guava/

  9. Google Guava官方教程(中文版)

    Google Guava官方教程(中文版) 原文链接  译文链接 译者: 沈义扬,罗立树,何一昕,武祖  校对:方腾飞 引言 Guava工程包含了若干被Google的 Java项目广泛依赖 的核心库, ...

随机推荐

  1. sql数据库还原,出现媒体簇的结构不正确,SQLServer无法处理此媒体簇的解决方法

    问题: sql数据库还原,出现媒体簇的结构不正确,SQL Server无法处理此媒体簇. 异常如下图. 造成问题的原因: 我的电脑上安装了sql2005和sql2008,问题就在于我用sql2008的 ...

  2. Storm 测试

    本文将学习如何使用java创建Storm拓扑 Storm集群的组件 Storm集群类似于Hadoop集群,只不过 Hadoop 上运行"MapReduce jobs", Storm ...

  3. 6_1.springboot2.x整合JDBC与数据源配置原理解析

    1.引言 对于数据访问层,无论是SQL还是NOSQL,Spring Boot默认采用整合 Spring Data的方式进行统一处理,添加大量自动配置,屏蔽了很多设置.引入各种xxxTemplate,x ...

  4. C# 反射的委托创建器

    原文:C# 反射的委托创建器 .Net 的反射是个很好很强大的东西,不过它的效率却实在是不给力.已经有很多人针对这个问题讨论过了,包括各种各样的 DynamicMethod 和各种各样的效率测试,不过 ...

  5. java_IO流(输入流)

    * 字节输入流(InputStream):所有字节输入流的父类 * 所有子类共性方法: * int read():从输入流中读取数据的下一个字节 * int read(byte[] b):从输入流中拂 ...

  6. java_增强for循环

    增强for循环(foreach): 底层使用了迭代器,简化了迭代器的书写 JDK1.5新特性 所有的单列集合都可以使用增强for循环 for(集合/数组 的数据类型 变量名 : 集合名/数组名) pu ...

  7. css,js文件后面加一个版本号

    由于前几天,更新了项目,更新的文件有js文件,今天客人截图过来,我发现修改之后的效果没有显示出来,我回复说清理浏览器缓存.到了晚上,客人找老板,说还没有处理到這个,说客人不懂這个.所以想到之前自己为了 ...

  8. System.UriFormatException: Invalid URI 解决方法

    mobox 企业网页登陆界面,sa 登陆后 提示 System.UriFormatException: Invalid URI: The URI scheme is not valid. at Sys ...

  9. LoadRunner参数化详解【转】

    距离上次使用loadrunner 已经有一年多的时间了.初做测试时在项目中用过,后面项目中用不到,自己把重点放在了工具之外的东西上,认为性能测试不仅仅是会用工具,最近又想有一把好的利器毕竟可以帮助自己 ...

  10. 使用WCF上传文件

              在WCF没出现之前,我一直使用用WebService来上传文件,我不知道别人为什么要这么做,因为我们的文件服务器和网站后台和网站前台都不在同一个机器,操作人员觉得用FTP传文件太麻 ...