materialEnvRotation
materialEnvRotation
提供一个 4×4 旋转矩阵(mat4),用于旋转环境贴图的采样方向:若材质已设置 envMap,则使用 material.envMapRotation;否则(材质未指定 envMap 且场景存在 environment)回退为 scene.environmentRotation;均未设置时返回单位矩阵。
核心优势
自动选择旋转来源并以矩阵形式输出,隐藏了 Euler→矩阵转换与空值回退逻辑,无需在 JS 中编写分支和同步 uniform,使反射/折射/IBL 的方向与环境旋转始终一致。
常见用途
旋转镜面/粗糙反射的采样方向,使其与旋转过的环境贴图对齐。
对同时存在“使用场景环境”和“独立 envMap”的物体自动应用各自旋转。
与背景/天空盒旋转时,确保 PBR 高光位置同步变化。
产品展示中通过动画化 envMapRotation 实现“转灯光不转物体”的效果。
如何调整
不要直接修改该节点;通过 JS 侧设置: 1) 材质有独立环境贴图时:设置 material.envMapRotation(THREE.Euler),如 material.envMapRotation.set(0, Math.PI/4, 0)。 2) 材质未设置 envMap 且使用 scene.environment 时:设置 scene.environmentRotation。 若两者都未设置,该节点输出单位矩阵(无旋转)。
代码示例
1
2// 1) 基于世界空间视线与法线计算反射方向
3const viewDirWorld = cameraPosition.sub( positionWorld ).normalize();
4const reflectedDirWorld = reflect( viewDirWorld.negate(), transformedNormalWorld );
5
6// 2) 用材质/场景环境旋转矩阵旋转该方向
7const rotatedDir = reflectedDirWorld.transformDirection( materialEnvRotation );
8
9// 3) 采样环境贴图并与基础色混合
10const env = uniformCubeTexture( myCubeTexture ).sample( rotatedDir );
11material.colorNode = mix( materialColor, env, 0.5 );
12