THREE.js中的反射材质

Question

我该如何创建一个能够反射场景中其他物体的材质？我尝试了reflectivity属性，但它没有反射任何东西。

这里有一个看起来具备这种效果的例子

它似乎并没有使用标准材质来创建。

- MCSharp

---

有很多很多这样的例子：http://threejs.org/examples/#webgl_materials_cars_camaro，http://threejs.org/examples/#webgl_materials_cubemap，http://threejs.org/examples/#webgl_materials_cubemap_balls_reflection - WestLangley

如果你想要一个镜子，这里也有一个例子：http://threejs.org/examples/#webgl_mirror - WestLangley

@WestLangley 所有的示例都使用环境图像进行反射，除了镜子。如果你仔细观察材质，你会看到使用的图像。我特别询问的是如何反射场景中的其他物体。镜子示例是一个很好的参考，谢谢。 - MCSharp

请查看 http://threejs.org/examples/#webgl_materials_cubemap_dynamic 和 http://threejs.org/examples/#webgl_materials_cubemap_dynamic2。 - WestLangley

Answer 1

简单说一下理论：反射基本上是从某个位置拍摄场景的图像。因此，如果您希望平面网格充当镜子，则必须在该位置添加相机，让其在动画循环中将场景渲染到纹理中，然后在平面网格的材质中使用该纹理。我还建议参考http://stemkoski.github.io/Three.js/Reflection.html以及WestLangley提到的示例。

另外，尝试调整设置；例如，要获得较少的反射效果，请尝试：

var mirrorMaterial = new THREE.MeshBasicMaterial( { color: 0x111111, envMap: mirrorCamera.renderTarget } );

或者

var mirrorMaterial = new THREE.MeshPhongMaterial( { emissive: 0x111111, envMap: mirrorCamera.renderTarget } );

- Stemkoski

---

谢谢您的回答。我正在寻找地面对象的反射材料。反射效果必须来自场景中的其他物体。我还没有看到所需效果的任何示例。类似于光滑的塑料或金属。反射会有一些扩散，不像镜子的例子那样完全反射。虽然镜子的例子是我见过的最接近的例子。您能否提供一些代码让我开始工作？ - MCSharp

尝试更改具有反射的物体的材料参数，这将使其反射较少并可能给它更多所需的效果。请参见上面更新的答案。 - Stemkoski

Answer 2

我用上面的例子做了这件事：

https://threejs.org/examples/#webgl_materials_cubemap

new THREE.MeshLambertMaterial ({
    map: texture,    
    envMap: scene.background,      
    combine: THREE.MixOperation,     
    reflectivity: .5     
})

我理解的关键变量是 THREE.MixOperation。

- Hoxz