添加 3D Tiles,并调整位置

3D Tiles 是什么

3DTiles数据集是cesium小组AnalyticlGraphics与2016年3月定义的一种数据集,3DTiles数据集以分块、分级渲染,将大数据量三维数据以分块,分层的形式组织起来,可以大量减轻浏览器和GPU的负担是一个优秀的,并且格式公开的数据格式。

3D Tiles将用于流式传输3D内容,包括建筑物,树木,点云和矢量数据。

参考 官网 3dtiles 介绍

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.计算偏移量

官方示例 3D Tiles Adjust Height

一步到位

//方法二,直接调用函数,调整高度,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,并调整位置,贴地的更多相关文章

  1. cesium编程入门(六)添加 3D Tiles,并调整位置,贴地

    添加 3D Tiles,并调整位置 3D Tiles 是什么 3DTiles数据集是cesium小组AnalyticlGraphics与2016年3月定义的一种数据集,3DTiles数据集以分块.分级 ...

  2. cesium编程入门(七)3D Tiles,模型旋转

    cesium编程入门(七)3D Tiles,模型旋转 上一节介绍了3D Tiles模型的位置移动,和贴地的操作,这一节来聊一聊模型的旋转, 参考<WebGl编程指南>的第四章 假设在X轴和 ...

  3. cesium编程入门(七)3D Tiles,模型旋转

    cesium编程入门(七)3D Tiles,模型旋转 上一节介绍了3D Tiles模型的位置移动,和贴地的操作,这一节来聊一聊模型的旋转, 参考<WebGl编程指南>的第四章 假设在X轴和 ...

  4. cesium编程中级(一)添加示例到Sandcastle

    cesium编程中级(一)添加示例到Sandcastle 添加示例到Sandcastle在cesium编程入门(七)3D Tiles,模型旋转中提到过,这里是一份完整的说明 创建例子 开启node服务 ...

  5. cesium编程入门(一)cesium简介

    cesium编程入门 cesium是什么 Cesium 是一个跨平台.跨浏览器的展示三维地球和地图的 javascript 库. Cesium 使用WebGL 来进行硬件加速图形,使用时不需要任何插件 ...

  6. cesium编程入门(九)实体 Entity

    cesium编程入门(九)实体 Entity 在cesium编程入门(五)绘制形状提到过添加实体的方法,这一节聊一聊实体相关的一些内容: 先来看 Entity 的各个属性 id 唯一标志,如果没设置, ...

  7. cesium编程入门(八)设置材质

    cesium编程入门(八)设置材质 Cesium中为几何形状设置材质有多种方法 第一种方法 Material 直接构建Cesium.Material对象,通过设置Material的属性来进行控制,官方 ...

  8. 脑残式网络编程入门(六):什么是公网IP和内网IP?NAT转换又是什么鬼?

    本文引用了“帅地”发表于公众号苦逼的码农的技术分享. 1.引言 搞网络通信应用开发的程序员,可能会经常听到外网IP(即互联网IP地址)和内网IP(即局域网IP地址),但他们的区别是什么?又有什么关系呢 ...

  9. cesium编程入门(五)绘制形状

    通过Entity添加形状 先来看一个添加立方体的例子 var viewer = new Cesium.Viewer('cesiumContainer'); var redBox = **viewer. ...

随机推荐

  1. php实现socket推送技术

    在socket出现之前已经有ajax定时请求.长轮询等方案,但都不能满足需求,socket就应用而生了. socket基本函数socket 总结下常用的socket函数 服务端: socket_cre ...

  2. HTML5 给图形绘制阴影(绘制五角星示例)

    几个属性 shadowOffsetX:阴影的横向位移量. shadowOffsetY:阴影的纵向位移量. shadowColor:阴影的颜色. shadowBlur:阴影的模糊范围. 属性说明 sha ...

  3. tornado 学习笔记

    import tornado.ioloop import tornado.web class MainHanlwe(tornado.web.RequestHandler): def get(self) ...

  4. python3 python2 import 的区别

    https://stackoverflow.com/questions/12172791/changes-in-import-statement-python3

  5. 关于vs2010下水晶报表的使用入门

    关于vs2010下使用水晶报表了解情况记录如下: 1.首先vs2010不再自带水晶报表控件了,需要下载安装vs2010配套的水晶报表控件:CRforVS_13_0.这个控件安装很简单,基本上都选择默认 ...

  6. ASP.NET Core学习之一 入门简介

    一.入门简介 在学习之前,要先了解ASP.NET Core是什么?为什么?很多人学习新技术功利心很重,恨不得立马就学会了. 其实,那样做很不好,马马虎虎,联系过程中又花费非常多的时间去解决所遇到的“问 ...

  7. 判断python对象是否可调用的三种方式及其区别

    查找资料,基本上判断python对象是否为可调用的函数,有三种方法 使用内置的callable函数 callable(func) 用于检查对象是否可调用,返回True也可能调用失败,但是返回False ...

  8. JavaWeb项目中获取对Oracle操作时抛出的异常错误码

    最近在项目中碰到了这么一个需求,一个JavaWeb项目,数据库用的是Oracle.业务上有一个对一张表的操作功能,当时设置了两个字段联合的唯一约束.由于前断没有对重复字段的校验,需要在插入时如果碰到唯 ...

  9. 日志采集框架Flume以及Flume的安装部署(一个分布式、可靠、和高可用的海量日志采集、聚合和传输的系统)

    Flume支持众多的source和sink类型,详细手册可参考官方文档,更多source和sink组件 http://flume.apache.org/FlumeUserGuide.html Flum ...

  10. C#中yield的使用

    yield 关键字向编译器指示它所在的方法是迭代器块.编译器生成一个类来实现迭代器块中表示的行为.在迭代器块中,yield 关键字与 return 关键字结合使用,向枚举器对象提供值.这是一个返回值, ...