【3Dtiles】3Dmax模型处理为gltf和3dtiles，包含LOD效果

在阅读glTF，3d tiles官方文档后，尝试使用官方的一些免费工具将3dmax模型处理成gltf和3d tiles模型。

3dmax版本：2018

模型资源：模型提取码：cuog

一、glTF

在3D Max中安装3DS Max exporter插件（该插件要求3D max版本为2015以上），可以直接从3dmax中导出glTF/glb。

同时为了之后转换的3d tiles有LOD效果，在3D Max对模型进行了三角网优化，复制两个相同模型，分别减少50%的顶点和75%的顶点。

二、3d tiles

gltf/glb转化为3d tiles模型，需要将其转换为.b3dm文件格式，再编写tileset.json文件。

推荐在vs code中安装glTF Tools直接查看glTF，并且可以验证glTF有效性。

为了减小.b3dm文件大小，加快前端加载速度，可使用KHR_draco_mesh_compression扩展压缩几何数据（坐标、动画、蒙皮数据等），同时减小贴图大小，尽量不超过1024X1024。

使用管网工具gltf-pipeline可以给gltf模型添加KHR_draco_mesh_compression扩展，还可以进行gltf/glb互转

//安装
npm install -g gltf-pipeline//压缩glTF几何数据
gltf-pipeline -i model.gltf -o modelDraco.gltf -d//结合gulp以类库的方式使用gltf-pipelineconst gltfPipeline = require('gltf-pipeline');
const fsExtra = require('fs-extra');
const processGltf = gltfPipeline.processGltf;
const gltf = fsExtra.readJsonSync('model.gltf');
const options = {separateTextures: true,compressionLevel: 7  //压缩级别 [0-10]
};
processGltf(gltf, options).then(function(results) {fsExtra.writeJsonSync('model-separate.gltf', results.gltf);// 保存贴图,.bin数据文件const separateResources = results.separateResources;for (const relativePath in separateResources) {if (separateResources.hasOwnProperty(relativePath)) {const resource = separateResources[relativePath];fsExtra.writeFileSync(relativePath, resource);}}});

glbToB3dm

接下来将三个级别的glTF模型转换为.b3dm文件。在vs code中将glTF转换为glb格式。

下载cesium官方的转换工具的开源代码

https://github.com/CesiumGS/3d-tiles-validator/tree/master/tools

//下载后安装依赖npm install

在根目录下，运行以下命令，将glb转换为.b3dm

node ./bin/3d-tiles-tools.js glbToB3dm -i ./specs/data/CesiumTexturedBox/CesiumTexturedBox.glb -o ./output/CesiumTexturedBox.b3dm

三个级别的glb文件依次转换为.b3dm文件。

最后写一个简单的tileset.json文件，在3dmax查看模型的尺寸，用于3d tiles中的包围盒参数。

tileset.json

tileset.json中参数的意义请查看规范文档：https://github.com/ComeformPC/3d-tiles/tree/master/specification

{"asset": {"version": "1.0"},"geometricError": 500, //几何误差，判断是否渲染子节点"root": {"transform": [  //使用Cesium.Transforms.eastNorthUpToFixedFrame(origin)设置模型位置0.05602263155122217,0.6403416087687968,0.7660444431189781,0,-0.9961946980917457,0.08715574274765825,0,0,-0.06676517241775076,-0.7631294127377697,0.6427876096865391,0,-426427.5649314479,-4874089.370505605,4077985.572200376,1],"boundingVolume": {  //因为gltf是Y轴向上，3d tiles为Z轴向上，cesium会将gltf旋转90度"box": [0,0,0,30.6,  //X轴尺寸一半，X轴不变0,0,0,28.9,  //Z轴尺寸一半0,0,0,8.73    //Y轴尺寸一半]},"geometricError": 0.2,"refine": "REPLACE","content": {"uri": "scene-low.b3dm"},"children": [{"boundingVolume": {"box": [0,0,0,30.6,0,0,0,28.9,0,0,0,8.73]},"geometricError": 0.1,"content": {"uri": "scene-medium.b3dm"},"children": [{"boundingVolume": {"box": [0,0,0,30.6,0,0,0,28.9,0,0,0,8.73]},"geometricError": 0,"content": {"uri": "scene-origin.b3dm"}}]}]}
}

在我的开源项目中有转换后的3dtiles。有兴趣可以看一下。

https://github.com/ComeformPC/cesiumProject/tree/master/public/data/tilesets/architecture