ThreeJS教程:PBR材质简介
推荐:将NSDT场景编辑器加入你的3D工具链
3D工具集:NSDT简石数字孪生
PBR材质简介
本节课没有具体的代码,就是给大家科普一下PBR材质,所谓PBR就是,基于物理的渲染(physically-based rendering)。
Three.js提供了两个PBR材质相关的APIMeshStandardMaterial
和MeshPhysicalMaterial
,MeshPhysicalMaterial
是MeshStandardMaterial
扩展的子类,提供了更多功能属性。
光照模型
如果你有初高中最基本的物理光学知识,应该有折射、镜面反射、漫反射等基本光学概念,对于实际生活中的光学问题,Three.js会提供一些的光照模型来模拟物体表面的光照,光照模型就一种模拟光照的计算方法。MeshPhysicalMaterial
和MeshLambertMaterial
一样都是渲染网格模型的材质,但是他们用的光照模型不同,具体点说就是材质模拟Mesh反射光照的代码算法不同,算法不同,自然模拟光照的真实程度也不同。
如果你想深入研究光照模型,可以学习下原生WebGL或WebGPU,或者看看计算机图形学相关书籍,使用threejs的大部分情况,用不着你自己实现光照模型算法,毕竟threejs通过网格模型材质帮你实现了。
PBR相关理论介绍文章
- 半小时了解PBR:https://zhuanlan.zhihu.com/p/37639418
- PBR知识体系整理:https://zhuanlan.zhihu.com/p/100596453
- PBR核心知识体系总结与概览:https://zhuanlan.zhihu.com/p/53086060
网格模型材质整体回顾
- MeshLambertMaterial: Lambert光照模型(漫反射)
- MeshPhongMaterial:Phong光照模型(漫反射、高光反射)
- MeshStandardMaterial和MeshPhysicalMaterial:基于物理的光照模型(微平面理论、能量守恒、菲涅尔反射...)
PBR材质相比MeshLambertMaterial和MeshPhongMaterial可以提供更逼真的、更接近生活中的材质效果,当然也会占用更多的电脑硬件资源。
通过MeshPhysicalMaterial文档,提供的资源,可以查看多个PBR材质的案例效果,系统课程中轿车展示案例也会用到PBR材质。
渲染占用资源和表现能力
整体上来看,就是渲染表现能力越强,占用的计算机硬件资源更多。
- 占用渲染资源 MeshBasicMaterial < MeshLambertMaterial < MeshPhongMaterial < MeshStandardMaterial < MeshPhysicalMaterial
- 渲染表现能力 MeshBasicMaterial < MeshLambertMaterial < MeshPhongMaterial < MeshStandardMaterial < MeshPhysicalMaterial