javascript THREE.js 中的反光材料
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/19731471/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Reflective material in THREE.js
提问by MCSharp
How can I create a material that reflects other shapes from the scene? I have tried the reflectivity
property but it didn't reflect anything.
如何创建反映场景中其他形状的材质?我已经尝试过该reflectivity
属性,但它没有反映任何内容。
There is an example that seems to have this effect: http://threejs.org/examples/#webgl_shading_physical
有一个例子似乎有这种效果:http: //threejs.org/examples/#webgl_shading_physical
It doesn't look like standard materials were used to create this.
它看起来不像是使用标准材料来创建的。
采纳答案by Lee Stemkoski
To go into a bit of the theory: a reflection is basically an image of the scene taken from a certain position. So if you want a planar mesh to serve as a mirror, you'll have to add a camera at that position, have it render the scene to a texture in the animation loop, and then use that texture in the material for the planar mesh. I would also recommend looking at http://stemkoski.github.io/Three.js/Reflection.htmlin addition to the examples WestLangley mentioned.
深入一点理论:反射基本上是从某个位置拍摄的场景图像。因此,如果您希望平面网格用作镜子,则必须在该位置添加一个相机,让它在动画循环中将场景渲染为纹理,然后在平面网格的材质中使用该纹理. 除了 WestLangley 提到的示例之外,我还建议您查看http://stemkoski.github.io/Three.js/Reflection.html。
Also, play around with settings; for a less reflective effect, for example, try:
此外,玩弄设置;例如,为了减少反射效果,请尝试:
var mirrorMaterial = new THREE.MeshBasicMaterial( { color: 0x111111, envMap: mirrorCamera.renderTarget } );
or
或者
var mirrorMaterial = new THREE.MeshPhongMaterial( { emissive: 0x111111, envMap: mirrorCamera.renderTarget } );
回答by Hoxz
https://threejs.org/examples/#webgl_materials_cubemap
I did it with the above example:
https://threejs.org/examples/#webgl_materials_cubemap
我用上面的例子做到了:
new THREE.MeshLambertMaterial ({
map: texture,
envMap: scene.background,
combine: THREE.MixOperation,
reflectivity: .5
})
The key variable, as i understand, is THREE.MixOperation
据我了解,关键变量是 THREE.MixOperation