添加 3D Tiles懊亡,并調(diào)整位置
3D Tiles 是什么
3DTiles數(shù)據(jù)集是cesium小組AnalyticlGraphics與2016年3月定義的一種數(shù)據(jù)集,3DTiles數(shù)據(jù)集以分塊乎串、分級(jí)渲染店枣,將大數(shù)據(jù)量三維數(shù)據(jù)以分塊速警,分層的形式組織起來(lái),可以大量減輕瀏覽器和GPU的負(fù)擔(dān)是一個(gè)優(yōu)秀的鸯两,并且格式公開的數(shù)據(jù)格式闷旧。
3D Tiles將用于流式傳輸3D內(nèi)容,包括建筑物钧唐,樹木忙灼,點(diǎn)云和矢量數(shù)據(jù)。
3D Tiles
3D Tiles將用于流式傳輸3D內(nèi)容钝侠,包括建筑物该园,樹木,點(diǎn)云和矢量數(shù)據(jù)帅韧。
contextCapture 可以將無(wú)人機(jī)成果轉(zhuǎn)換成Cesium支持的傾斜攝影成果里初,當(dāng)前例子就是使用的這種成果。
數(shù)據(jù)的加載比較簡(jiǎn)單
var tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
url: url, //數(shù)據(jù)路徑
maximumScreenSpaceError: 2, //最大的屏幕空間誤差
maximumNumberOfLoadedTiles: 1000, //最大加載瓦片個(gè)數(shù)
modelMatrix: m //形狀矩陣
}));
但是問題在于生成的數(shù)據(jù)不一定是落在地面上忽舟,有可能是浮在空中的双妨,例如:
這并不是我們想要的,我們希望拍攝的成果能貼到地面上,和地圖能很好的融合在一起叮阅,類似這樣
由于單個(gè)瓦片的位置信息是寫到了數(shù)據(jù)中的(.b3dm和對(duì)應(yīng)的json文件中),如果能整體調(diào)整加載后的tileset刁品,就會(huì)是最好的選擇,這里就要提到本文的主角:
modelMatrix
通過查看API文檔浩姥,我們發(fā)現(xiàn)Cesium3DTile里面有一個(gè)屬性挑随,可以更改位置(當(dāng)然通過查看源碼也可以查這個(gè))
transform : Matrix4 Scene/Cesium3DTile.js 88
The local transform of this tile
說明通過矩陣運(yùn)算是可以調(diào)整整個(gè)數(shù)據(jù)的顯示位置的
以下說明矩陣平移的情況:
1. 自己獲取偏移量
參考《WebGl編程指南》的第三章第四章
Tx,Ty,Tz就是我們需要設(shè)置的 x,y,z方向上的平移距離
由于Cesium的矩陣是列主序的,所以這里寫成
//創(chuàng)建平移矩陣方法一
// 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
// ]);
//創(chuàng)建平移矩陣方法二
var translation=Cesium.Cartesian3.fromArray([x, y, z]);
m= Cesium.Matrix4.fromTranslation(translation);
//生效
tileset._modelMatrix = m;
這里我們只需要不斷的修改 x,y,z及刻,就可以調(diào)整物體的位置了
獲取 x,y,z 之后,在加載3D Tiles 時(shí)將modelMatrix 設(shè)置成目標(biāo) x,y,z值镀裤,就完成了
2.計(jì)算偏移量
一步到位
//方法二竞阐,直接調(diào)用函數(shù)缴饭,調(diào)整高度,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
個(gè)人主頁(yè) http://cesium.xin
Cesium學(xué)習(xí)交流群:593764057(滿),476893082