《Cesium 基础知识点》- 3dtiles 调用

目录

一、普通 3dtiles

二、Cesium Ion 3dtiles

三、模型偏移(重点)

---

一、普通 3dtiles

1、添加

// 3d tiles 对象
let tileSet = new Cesium.Cesium3DTileset({
    url: './data/3dtile.json'
});
// 定位
tileSet.readyPromise.then(function (tileset) {
    // tileset的边界球
    let boundingSphere = tileset.boundingSphere;
    // 跳到边界球范围
    viewer.camera.viewBoundingSphere(boundingSphere, new Cesium.HeadingPitchRange(0.0, -0.5, boundingSphere.radius));
}).otherwise(function (e) {
    throw(e);
});
// 添加
let layer = viewer.scene.primitives.add(tileSet);

2、删除

// 删除
viewer.scene.primitives.remove(layer);

3、设置透明度

//0 - 1 之间， 0 为全透明、1 为不透明
var aplha = 0.5
// 设置
layer.style = new Cesium.Cesium3DTileStyle({
    color: {
        evaluateColor: function (feature, result) {
            return new Cesium.Color(1, 1, 1, alpha);
        }
    }
});

4、隐藏与显示

// true 为显示 ，false 为隐藏
var show = false;
// 设置
layer.style = new Cesium.Cesium3DTileStyle({
    show: 
});

二、Cesium Ion 3dtiles

添加，删除与上述一致

// 需要 token
Cesium.Ion.defaultAccessToken = 'your ion token';
// 3d tiles 对象
let tileSet = viewer.scene.primitives.add(
    new Cesium.Cesium3DTileset({
        url: Cesium.IonResource.fromAssetId(43978),
    })
);
// 定位
tileSet.readyPromise.then(function (tileset) {
    // tileset的边界球
    let boundingSphere = tileset.boundingSphere;
    // 跳到边界球范围
    viewer.camera.viewBoundingSphere(boundingSphere, new Cesium.HeadingPitchRange(0.0, -0.5, boundingSphere.radius));
}).otherwise(function (e) {
    throw(e);
});

三、模型偏移(重点)

参考：链接

链接里还可以改变模型的颜色等操作

四、3d Tiles 数据规范

参考：

链接01

链接02

3dTiles的特点总结如下：

• 三维模型使用了 glTF 规范，继承它的渲染高性能
• 除了嵌入的 glTF，3dTiles 自己 只记录各级Tile的空间逻辑关系（如何构成整个3dtiles）和属性信息，以及模型与属性如何挂接在一起的信息