Cesium案例解析(五)——3DTilesPhotogrammetry摄影测量3DTiles数据
1. 概述
3D Tiles是用于传输和渲染大规模3D地理空间数据的格式,例如摄影测量,3D建筑,BIM / CAD,实例化特征和点云等。与常规的模型文件格式相比,最大的特点就是包含了分层分户的瓦片,根据可视化需要呈现相应的细节,并且已经被纳入到OGC规范当中。
在Cesium的自带示例3D Tiles Photogrammetry中,展示的摄影测量3DTiles数据是通过Cesium Ion上托管的,只需要相应的编号就可以了。实际生产中的3DTiles数据可以通过像ContextCapture这样的三维建模软件得到,然后通过Cesium本地加载。
2. 案例
HTML页面3DTilesPhotogrammetry.html代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta name="description" content="A sample photogrammetry dataset rendered with 3D Tiles.">
<meta name="cesium-sandcastle-labels" content="Beginner, Tutorials, Showcases">
<title>Cesium Demo</title>
<script type="text/javascript" src="../Build/Cesium/Cesium.js"></script>
<style>
@import url(../Build/Cesium/Widgets/widgets.css);
html,
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
font-family: sans-serif;
background: #000;
}
.fullSize {
display: block;
position: absolute;
top: 0;
left: 0;
border: none;
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<div id="cesiumContainer" class="fullSize"></div>
<script src="3DTilesPhotogrammetry.js"></script>
</body>
</html>
主要的javascript代码3DTilesPhotogrammetry.js如下:
'use strict';
var viewer = new Cesium.Viewer('cesiumContainer', {
terrainProvider: Cesium.createWorldTerrain()
});
var tileset = new Cesium.Cesium3DTileset({
url: "../dayanta/tileset.json"
});
viewer.scene.primitives.add(tileset);
viewer.zoomTo(tileset);
可以看到这里通过3DTiles数据路径,创建了一个Cesium.Cesium3DTileset对象。但与加载glTF模型不同,加载3DTiles需要将其加入到场景类(viewer.scene)的图元集合对象(primitives)中去。图元类(Cesium.Primitive)也就是场景中的几何图形,Cesium应该是将3DTiles作为图元展示在场景中。
3. 结果
最终运行结果如下所示,展示了西安大雁塔景区的模型:
Cesium案例解析(五)——3DTilesPhotogrammetry摄影测量3DTiles数据的更多相关文章
- Cesium案例解析(六)——3DTilesInspector监视器
目录 1. 概述 2. 案例 1. 概述 3D Tiles作为传输和渲染大规模3D地理空间数据的格式,应对的都是大规模数据的场景,Cesium提供了一个监视3D Tiles数据的监视器,可以通过这个监 ...
- Cesium案例解析(二)——ImageryLayers影像图层
目录 1. 概述 2. 实例 2.1. ImageryLayers.html 2.2. ImageryLayers.js 2.2.1. 代码 2.2.2. 解析 3. 结果 1. 概述 Cesium支 ...
- Cesium案例解析(四)——3DModels模型加载
目录 1. 概述 2. 代码 3. 解析 4. 参考 1. 概述 Cesium自带的3D Models示例,展示了如何加载glTF格式三维模型数据.glTF是为WebGL量身定制的数据格式,在网络环境 ...
- Cesium案例解析(三)——Camera相机
目录 1. 概述 2. 实例 2.1. Camera.html 2.2. Camera.js 2.2.1. 飞行至某一点 2.2.2. 飞行至某区域 2.2.3. 两地之间飞行 2.2.4. 设置视图 ...
- Cesium案例解析(一)——HelloWorld
目录 1. 概述 2. 实例 2.1. HelloWorld.html 2.2. HelloWorld.js 3. 结果 1. 概述 感觉网上已经有不少关于cesium的教程了,但是学习一个框架最快的 ...
- 【Python五篇慢慢弹(5)】类的继承案例解析,python相关知识延伸
类的继承案例解析,python相关知识延伸 作者:白宁超 2016年10月10日22:36:57 摘要:继<快速上手学python>一文之后,笔者又将python官方文档认真学习下.官方给 ...
- 【无人机航空摄影测量精品教程】目录:摄影测量、Pix4d、EPS、CC、PhotoScan项目化作业流程及注意事项汇总
目录 1. 专栏简介 2. 专栏地址 3. 专栏目录 1. 专栏简介 该专栏为目前最为热门的无人机航测内外业项目,主要内容包括:无人机航测外业作业流程(像控点布设.航线规划.仿地飞行.航拍)和内业数据 ...
- 《高性能SQL调优精要与案例解析》一书谈SQL调优(SQL TUNING或SQL优化)学习
<高性能SQL调优精要与案例解析>一书上市发售以来,很多热心读者就该书内容及一些具体问题提出了疑问,因读者众多外加本人日常工作的繁忙 ,在这里就SQL调优学习进行讨论并对热点问题统一作答. ...
- SQL Server 连接问题案例解析(1)
SQL Server 连接问题案例解析(1) 转载自:http://blogs.msdn.com/b/apgcdsd/archive/2015/04/27/sql.aspx?CommentPosted ...
随机推荐
- 美食家App开发日记1
前期一直在看第一行代码Android,这本书感觉讲基础讲得特别细致. 百看不如一试. 因为刚刚接触Android,没办法做到想写什么功能就直接一下写好,只能从最开始基础的控件使用开始练习. 所以一直在 ...
- 【WPF学习】第十七章 键盘输入
当用户按下键盘上的一个键时,就会发生一系列事件.下表根据他们的发生顺序列出了这些事件: 表 所有元素的键盘事件(按顺序) 键盘处理永远不会像上面看到的这么简单.一些控件可能会挂起这些事件中的某些事件, ...
- Java基础语法和基本数据类型
Java基础语法 一个Java程序可以认为是一系列对象的集合,而这些对象通过调用彼此的方法来协同工作. 对象:对象是类的一个实例,有状态(属性)和行为(方法). 类:类是一个模板,他描述一类对象的行为 ...
- js 获取元素坐标 和鼠标点击坐标
js 获取元素的位置 var odiv=document.getElementById('divid'); alert(odiv.getBoundingClientRect().left); aler ...
- go--->共享内存和通信两种并发模式原理探究
共享内存和通信两种并发模式原理探究 并发理解 人类发明计算机编程的本质目的是为了什么呢?毫无疑问是为了解决人类社会中的各种负责业务场景问题.ok,有了这个出发点,那么想象一下,比如你既可以一心一意只做 ...
- P4452 [国家集训队]航班安排(最大费用最大流)
P4452 [国家集训队]航班安排 题目传送门 解题思路: 感觉题面让人有很多误解,就是说有k架飞机在0点从0号机场起飞,在t时刻返回机场,给出空载飞行的时间和花费以及m个包机请求的花费和起始时间和终 ...
- PKU-2723 Get Luffy Out(2-SAT+二分)
Get Luffy Out 题目链接 Ratish is a young man who always dreams of being a hero. One day his friend Luffy ...
- Leetcode 题目整理-3 Palindrome Number & Roman to Integer
9. Palindrome Number Determine whether an integer is a palindrome. Do this without extra space. clic ...
- vue2.x中使用计算属性巧妙的实现多选框的“全选”
接下来我会以一个购物车的例子,来演示如果借助计算属性,精巧的实现多选框的全选功能.当然,有全选,自然对应的也还有取消全选. 以下这张gif图,就是最终的实现效果: 第一步,针对购物车每一个商品进行设置 ...
- NOIP2018PJ游记
\(NOIP2018\)普及AFO记 178pt,2=,in ZJ_Hangzhou_学军中学 \(Day\) \(0\) 中午就请假回家打模板了 \(Day\) \(1\) \(A.M.8-12\) ...