Ceisum官方教程1 -- 开始
原文地址：https://cesium.com/docs/tutorials/getting-started/
学会使用全球地形、影像、3d tile（模型切片）、地理编码创建一个Cesium程序。
CesiumJS是一个基于javascript的浏览器器3d地图引擎。Cesium ion是一个3d内容的发布中心并且可以把你自己的数据进行切片、发布服务。CesiumJS和 ion 配合起来可以创建世界级3d地图程序。
第一个程序
代码如下：
<!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的程序。修改代码后，这个弹出窗口会自动刷新。
代码分析：
在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”，就看到如下图效果：
Ceisum官方教程1 -- 开始的更多相关文章
- Ceisum官方教程2 -- 项目实例（workshop）
原文地址:https://cesiumjs.org/tutorials/Cesium-Workshop/ 概述 我们很高兴欢迎你加入Cesium社区!为了让你能基于Cesium开发自己的3d 地图项目 ...
- Ceisum官方教程3 -- 空间数据可视化
原文地址:https://cesiumjs.org/tutorials/Visualizing-Spatial-Data/ 这篇教程教你如何使用Cesium的Entity API去绘制空间数据,如点, ...
- Unity性能优化（3）-官方教程Optimizing garbage collection in Unity games翻译
本文是Unity官方教程,性能优化系列的第三篇<Optimizing garbage collection in Unity games>的翻译. 相关文章: Unity性能优化(1)-官 ...
- Unity性能优化（4）-官方教程Optimizing graphics rendering in Unity games翻译
本文是Unity官方教程,性能优化系列的第四篇<Optimizing graphics rendering in Unity games>的翻译. 相关文章: Unity性能优化(1)-官 ...
- Unity性能优化（2）-官方教程Diagnosing performance problems using the Profiler window翻译
本文是Unity官方教程,性能优化系列的第二篇<Diagnosing performance problems using the Profiler window>的简单翻译. 相关文章: ...
- Unity性能优化（1）-官方教程The Profiler window翻译
本文是Unity官方教程,性能优化系列的第一篇<The Profiler window>的简单翻译. 相关文章: Unity性能优化(1)-官方教程The Profiler window翻 ...
- jeecg表单页面控件权限设置（请先看官方教程，如果能看懂就不用看这里了）
只是把看了官方教程后,觉得不清楚地方补充说明一下: 1. 2. 3. 4.用"jeecgDemoController.do?addorupdate"这个路径测试,不出意外现在应该可 ...
- [转]Google Guava官方教程（中文版）
Google Guava官方教程(中文版) http://ifeve.com/google-guava/
- Google Guava官方教程（中文版）
Google Guava官方教程(中文版) 原文链接 译文链接 译者: 沈义扬,罗立树,何一昕,武祖 校对:方腾飞 引言 Guava工程包含了若干被Google的 Java项目广泛依赖 的核心库, ...
随机推荐
- HTML <body>的常用属性
bgColor : 网页背景色 如 <body bgColor="red"> Background : 网页背景图片的地址 如 <body background ...
- nodejs与websocket模拟简单的聊天室
nodejs与websocket模拟简单的聊天室 server.js const http = require('http') const fs = require('fs') var userip ...
- 17.splash_case06_ScrapySplashTest-master
taobao.py # -*- coding: utf-8 -*- from scrapy import Spider, Request from urllib.parse import quote ...
- 16.ajax_case09
import requests import json import re from selenium import webdriver from selenium.webdriver.common. ...
- neo4j中cypher语句多个模糊查询
总结一下经验: neo4j中,cypher语句的模糊查询,好像是个正则表达式结构. 对于一个属性的多个模糊查询,可以使用如下写法: 比如,查询N类型中,属性attr包含'a1'或者'a2'的所有节点. ...
- Idea 2018.2.5创建springboot项目依赖包没有的错误
- opencv-识别手写数字
首先拆分图片得到数据 #include "stdafx.h" #include <iostream> #include "opencv2/opencv.hpp ...
- 转载：Linux命令经典面试题：统计文件中出现次数最多的前10个单词
1.使用linux命令或者shell实现:文件words存放英文单词,格式为每行一个英文单词(单词可以重复),统计这个文件中出现次数最多的前10个单词 主要考察对sort.uniq命令的使用,相关解释 ...
- 关于电容与Q值
1, 电容模型 电容阻抗可以表示为: 可算得自谐振频率点为: 在该点,容抗与感抗差为0,电容表现出纯电阻性. 2, 阻抗曲线 自谐点是区分电容器呈容性还是感性的分界点.从阻抗曲线看,在自谐点附近阻抗较 ...
- 【转载】linux文件系统简介
文件系统是linux的一个十分基础的知识,同时也是学习linux的必备知识. 本文将站在一个较高的视图来了解linux的文件系统,主要包括了linux磁盘分区和目录.挂载基本原理.文件存储结构.软链接 ...