一、项目介绍

目的：

把倾斜摄影的大体量模型，转换成Thing-JS能高性能使用的WebGL版本；

本篇主要为项目流程分享，欢迎私信交流。

(资料图)

资源来源：

https://sketchfab.com/3d-models/la-night-city-a85450184c6e4ddf87b49c402641e5b4

原始资源大小：

GLTF文件大小 143M（模型130W面 + 5套8096材质贴图 ）

优化后资源后大小：

GLTF文件大小 3M（模型2.1W面 + 3套2048材质贴图）

使用软件：

Blender 3.3.6

原始效果截图：

优化效果截图：

二、优化步骤

s01：导入

导入原始模型；

s02：建筑重拓扑

1、重拓表面建筑；

要求1：面数尽量精简；

要求2：拓扑模型尽量和原模型贴合；

2、根据纹素大小拆分模型；

纹素：每1米的模型尺寸使用多大的贴图像素空间；

经测试：该园区在0.5px/m时，能最大可能保留细节的同时，精简贴图资源大小；

所以这里把拓扑模型拆成两份，使用两张2048的贴图就能符合要求。

如下图：园区90m宽的建筑实际占用：90*0.55=49.5个像素

3、分模型UV+烘培贴图；

UV要求1：不能有重叠；

UV要求2：UV块间隔5个像素；

烘培要求：检测高模纹理的内外距离要调大一些，这样能确保不出现黑色无像素块；

4、选择建筑底面，复制出来一个独立模型。用作与地面结合时，裁剪地面的形状；

s03：园区拓扑前准备

1、删除高出地形的建筑；

尽量保留所有地形；

建筑部分保留越少，后续操作越方便；

2、删除地块的四个边缘和底面；

原因：拓扑软件的原理是均匀分布，所以要把无效部分尽可能都删掉；

s04：园区重拓扑

1、应用插件，测试合适的减面数量级；

插件：Quad Remesher 1.23

2、手动补全模型孔洞，以及删除碎面和重叠面，以及补全地块边缘；

补孔洞的目的：后续配合建筑的底面轮廓，重新挖出（bool）完全贴合建筑的孔洞；

补孔洞时要注意：把一些竖直的面都删了，这些面是建筑残留，会影响后续的bool运算；

补全地块边缘：挤出一个条状面，对齐成直线就行。

3、把高模的材质纹理烘培到优化好的模型上；

4、利用建筑底面轮廓，把底面的多余面给抠出（bool运算）；

如果底面与建筑融合后，没有交叉重合的bug，这一步可以省略，或者手动删除交叉部分来代替这一步；

s05：合并模型

1、把建筑和园区合并；

2、给整体模型制作厚度和底面；

s06：输出GLTF

1、烘培的贴图输出，并压缩；

在PS中，减少图片的颜色采样数量，即可达到大体积压缩图片的目的；

2、重新导入贴图，把材质配置成GLTF输出的样式即可；

本项目如下图，制作的为不受光材质；

关键词：