Cesium+Three.js体验：优化BIM模型展示效果

前面我们介绍了5个Cesium和Three.js结合的方案（《Cesium和Three.js结合的5个方案》），其中深度融合方案实现难度大，今天我们通过一次BIM模型展示效果调优过程，来窥探一下这个方案的具体优势。

1、实现过程

BIM模型格式：ifc；
显示和调优工具：基于Cesium+Three.js实现的模型编辑工具。
代码量：0行。

1.1、导入模型

点击【文件】->【导入本地模型】，然后选择ifc格式模型，完成模型导入；
在模型属性面板中调整模型位置。


可以看出，模型比较平面，不够立体，尤其是树和建筑的拐角处，轮廓并不清晰。

• 1.2、设置环境贴图

点击【设置】->【项目设置】，切换到项目属性设置面板。在【场景】标签页中找到【环境贴图】栏，点击【环境贴图】矩形区域，在弹出的窗口中选择环境贴图。

对比上一步，白色部分有些许变化，但是明暗对比度仍然不够。

1.3、启用LightProbe

到目前，场景中有环境光和太阳光，这两种光照颜色和强度对于被照射的部分，都是基本一样的，所以亮部和暗部之间并没有过渡。可能是因为BIM模型材质类型并非Standard或者Physical，环境贴图没有起作用。

为改善这种状况，我启用LightProbe（我们工具用“光照探针”这个翻译）。操作很简单，在【场景】标签页中【基础光照】，将【光照探针】切换为【启用】。

1.4、调整太阳光

拖动时间轴，调整太阳的位置，看看阳光不同角度照射的效果。

树的部分有很明显变化，其他部分也有细微的改进了。

• 1.5、开启AO和抗锯齿

切换到【地球】标签页，将【环境光遮蔽(AO)】切换为【启用】，将【抗锯齿】切换为【是】。

可以发现，拐角处及附近的明暗对比、过渡得到了改善。

• 1.6、调整AO参数

在【地球】标签页中找到【环境光遮蔽(AO)】栏，微调各个参数，直到得到比较满意的效果。

2、优化效果

最后看从外到内，看一下优化结果吧。

2.1、整体效果

2.2、室外效果

** 2.3、室外细节**

2.4、室内细节

两个字：快，稳！
欢迎咨询，后台回复【商务合作】，获取联系方式！

欢迎关注微信公众号【三维网格3D】，第一时间获取最新文章