我怎样才能在three.js中使用反射？

Question

我希望在带有Three.js的WebGL页面中有一个反射立方体表面。它应该类似于手机显示屏，它可以反射一些光线，但它仍然必须是黑色的。

Answer 1

我创建了一个带有详细注释的反射立方体（以及反射球体）的示例。实时版本位于

http://stemkoski.github.com/Three.js/Reflection.html

使用格式良好的代码

https://github.com/stemkoski/stemkoski.github.com/blob/master/Three.js/Reflection.html

（这是http://stemkoski.github.com/Three.js/）

的教程示例集合的一部分

要点是：

• 在场景中添加第二个相机（CubeCamera），该相机位于表面应该是反光的物体上
• 创建一个材质并将环境贴图设置为第二个摄影机的渲染结果，例如

例如：

 var mirrorCubeMaterial = new THREE.MeshBasicMaterial( 
    { envMap: mirrorCubeCamera.renderTarget } );

• 在渲染功能中，您必须从所有相机渲染。暂时隐藏正在反射的物体（这样它不会妨碍您将要使用的相机），从该相机渲染，然后取消隐藏反射物体。

例如：

mirrorCube.visible = false;
mirrorCubeCamera.updateCubeMap( renderer, scene );
mirrorCube.visible = true;

这些代码段来自我上面发布的链接;检查出来！