【Cesium】cesium学习记录0x03(添加3Dtiles)

1,281 阅读2分钟

image.png

关于3D tiles

image.png

3D Tiles 专为流式传输和渲染大量 3D 地理空间内容而设计,例如摄影测量、3D 建筑、BIM/CAD、实例化特征和点云。它定义了一个分层数据结构和一组提供可渲染内容的图块格式。3D Tiles 没有为内容的可视化定义明确的规则;客户可以定义任何合适的数据。

一个 3D Tiles 数据集,称为瓦片集,包含组织成空间数据结构的瓦片格式的任意组合。

3D Tiles 是声明性的、可扩展的,并且适用于各种类型的 3D 数据。以下平铺格式已指定为3d tiles的一部分:

  • 批量 3D 模型
  • 实例化 3D 模型
  • 点云
  • 合成的

3D Tiles,3D Tiles是在glTF的基础上,加入了分层LOD的结构后得到的产品,专门为大量地理3D数据流式传输和海量渲染而设计的一种格式,是目前大火的开源WebGL框架Cesium的御用格式.

Bing机翻,实在懒得动 原文档 image.png

Tilesets and Tiles

image.png

image.png

cesium中使用3dtiles

        //加载3d tiles
        var tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
            url: url, //数据路径
            maximumScreenSpaceError: 2, //最大的屏幕空间误差
            maximumNumberOfLoadedTiles: 1000, //最大加载瓦片个数
            modelMatrix: m //形状矩阵   
        }));

注意:生成的数据不一定是落在地面上,有可能存在半空中,由于单个瓦片中信息写到了数据结构中的.b3m和json中,为了获得更好的效果,我们期望能够整体调整加载后的tilset,那么就需要用的闲心代数中的矩阵

modeMatrix

测试出偏移量

image.png

可以看到,对一个目标做平移必定会用到平移矩阵。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,x]);
        m=Cesium.Matrix4.fromArray.fromTranslation(translation);

计算偏移量

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);
        }