cesium编程入门(六)添加 3D Tiles,并调整位置,贴地
添加 3D Tiles,并调整位置
3D Tiles 是什么
3DTiles数据集是cesium小组AnalyticlGraphics与2016年3月定义的一种数据集,3DTiles数据集以分块、分级渲染,将大数据量三维数据以分块,分层的形式组织起来,可以大量减轻浏览器和GPU的负担是一个优秀的,并且格式公开的数据格式。
3D Tiles将用于流式传输3D内容,包括建筑物,树木,点云和矢量数据。
3D Tiles
3D Tiles将用于流式传输3D内容,包括建筑物,树木,点云和矢量数据。
contextCapture 可以将无人机成果转换成Cesium支持的倾斜摄影成果,当前例子就是使用的这种成果。
数据的加载比较简单
var tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
url: url, //数据路径
maximumScreenSpaceError: 2, //最大的屏幕空间误差
maximumNumberOfLoadedTiles: 1000, //最大加载瓦片个数
modelMatrix: m //形状矩阵
}));
但是问题在于生成的数据不一定是落在地面上,有可能是浮在空中的,例如:

这并不是我们想要的,我们希望拍摄的成果能贴到地面上,和地图能很好的融合在一起,类似这样

由于单个瓦片的位置信息是写到了数据中的(.b3dm和对应的json文件中),如果能整体调整加载后的tileset,就会是最好的选择,这里就要提到本文的主角:
modelMatrix
通过查看API文档,我们发现Cesium3DTile里面有一个属性,可以更改位置(当然通过查看源码也可以查这个)
transform : Matrix4 Scene/Cesium3DTile.js 88
The local transform of this tile
说明通过矩阵运算是可以调整整个数据的显示位置的
以下说明矩阵平移的情况:
1. 自己获取偏移量
参考《WebGl编程指南》的第三章第四章

Tx,Ty,Tz就是我们需要设置的 x,y,z方向上的平移距离
由于Cesium的矩阵是列主序的,所以这里写成
//创建平移矩阵方法一
// m = Cesium.Matrix4.fromArray([
// 1.0, 0.0, 0.0, 0.0,
// 0.0, 1.0, 0.0, 0.0,
// 0.0, 0.0, 1.0, 0.0,
// x, y, z, 1.0
// ]);
//创建平移矩阵方法二
var translation=Cesium.Cartesian3.fromArray([x, y, z]);
m= Cesium.Matrix4.fromTranslation(translation);
//生效
tileset._modelMatrix = m;
这里我们只需要不断的修改 x,y,z,就可以调整物体的位置了
获取 x,y,z 之后,在加载3D Tiles 时将modelMatrix 设置成目标 x,y,z值,就完成了

2.计算偏移量
一步到位
//方法二,直接调用函数,调整高度,height表示物体离地面的高度
function changeHeight(height) {
height = Number(height);
if (isNaN(height)) {
return;
}
var cartographic = Cesium.Cartographic.fromCartesian(tileset.boundingSphere.center);
var surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, cartographic.height);
var offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude,height);
var translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3());
tileset.modelMatrix = Cesium.Matrix4.fromTranslation(translation);
}
参考代码:lesson02
cesium编程入门(六)添加 3D Tiles,并调整位置,贴地的更多相关文章
- cesium编程入门(六)添加 3D Tiles,并调整位置,贴地
添加 3D Tiles,并调整位置 3D Tiles 是什么 3DTiles数据集是cesium小组AnalyticlGraphics与2016年3月定义的一种数据集,3DTiles数据集以分块.分级 ...
- cesium编程入门(七)3D Tiles,模型旋转
cesium编程入门(七)3D Tiles,模型旋转 上一节介绍了3D Tiles模型的位置移动,和贴地的操作,这一节来聊一聊模型的旋转, 参考<WebGl编程指南>的第四章 假设在X轴和 ...
- cesium编程入门(七)3D Tiles,模型旋转
cesium编程入门(七)3D Tiles,模型旋转 上一节介绍了3D Tiles模型的位置移动,和贴地的操作,这一节来聊一聊模型的旋转, 参考<WebGl编程指南>的第四章 假设在X轴和 ...
- cesium编程中级(一)添加示例到Sandcastle
cesium编程中级(一)添加示例到Sandcastle 添加示例到Sandcastle在cesium编程入门(七)3D Tiles,模型旋转中提到过,这里是一份完整的说明 创建例子 开启node服务 ...
- cesium编程入门(一)cesium简介
cesium编程入门 cesium是什么 Cesium 是一个跨平台.跨浏览器的展示三维地球和地图的 javascript 库. Cesium 使用WebGL 来进行硬件加速图形,使用时不需要任何插件 ...
- cesium编程入门(九)实体 Entity
cesium编程入门(九)实体 Entity 在cesium编程入门(五)绘制形状提到过添加实体的方法,这一节聊一聊实体相关的一些内容: 先来看 Entity 的各个属性 id 唯一标志,如果没设置, ...
- cesium编程入门(八)设置材质
cesium编程入门(八)设置材质 Cesium中为几何形状设置材质有多种方法 第一种方法 Material 直接构建Cesium.Material对象,通过设置Material的属性来进行控制,官方 ...
- 脑残式网络编程入门(六):什么是公网IP和内网IP?NAT转换又是什么鬼?
本文引用了“帅地”发表于公众号苦逼的码农的技术分享. 1.引言 搞网络通信应用开发的程序员,可能会经常听到外网IP(即互联网IP地址)和内网IP(即局域网IP地址),但他们的区别是什么?又有什么关系呢 ...
- cesium编程入门(五)绘制形状
通过Entity添加形状 先来看一个添加立方体的例子 var viewer = new Cesium.Viewer('cesiumContainer'); var redBox = **viewer. ...
随机推荐
- RPM包下载网址
https://pkgs.org/ (最爱) http://rpm.pbone.net/ http://rpmfind.net/linux/RPM/index.html
- 软件测试——Peer Review
一.什么是peer review peer review是一种通过作者的同行来确认缺陷和需要变更区域的检查方法.需要进行同行评审的特定产品在定义项目软件过程的时候被确定并且作为软件开发计划的一部分被安 ...
- 告诉你C盘里的每个文件夹都是干什么用的 ! ! !
Documents and Settings是什么文件? 答案: 是系统用户设置文件夹,包括各个用户的文档.收藏夹.上网浏览信息.配置文件等. 补:这里面的东西不要随便删除,这保存着所有用户的文档 ...
- 学python着几个要搞清楚WSGI和uWSGI区别
1 WSGI是一种通信协议 2 uwsgi是一种线路协议而不是通信协议,在此常用于在uWSGI服务器与其他网络服务器的数据通信. 3 而uWSGI是实现了uwsgi和WSGI两种协议的Web服务器.
- UCI一位搞theory的教授列的一些数学方面的比较趣味性的网页
http://www.ics.uci.edu/~eppstein/recmath.html 据说是recreational的,没具体看,先收藏下来.
- 关于memcache分布式一致性hash
consistent hashing 算法早在 1997 年就在论文 Consistent hashing and random trees 中被提出,目前在 cache 系统中应用越来越广泛: 1 ...
- .net core 下的一个docker hello world
接触 docker 有段时间了,发现docker这个东西,真是越用越爽. 那就从零开始跑一个 docker simple . 方法一: 步骤一: dotnet new mvc --name myweb ...
- 取出资源文件中的bitmap,并将其保存到TMemoryStream中,从资源里载入图象而不丢失调色板
从资源里载入图象而不丢失调色板 procedure loadgraphic(naam:string);var { I've moved these in here, so they exist on ...
- errorlevel 续1
-------siwuxie095 常用 errorlevel 返回值: backup 0 备份成功 1 未找到备份文件 2 文件共享冲突阻止备份完成 3 用户用 ct ...
- 使用透明flash+背景图片制作绚丽页面
关键代码: <div style="width: 469px; height: 303px; background-image: url('https://images0.cnblog ...