Three.js 的真实照明(阳光)? [英] Realistic lighting (sunlight) with Three.js?

问题描述

我正在尝试使用 Three.js 创建一个小型的第一人称游戏，但是我在照明方面遇到了问题.基本上我想模拟太阳并让它在所有物体上投射光旋转.我目前正在使用 THREE.DirectionalLight，它只照亮一个方向，因此立方体的侧面保持黑色/深色.

I'm attempting to create a small 1st-person game using Three.js, but I'm having trouble with the lighting. Basically I want to simulate the sun and have it rotate around casting light on everything. I'm using THREE.DirectionalLight at the moment and it only lights up the one direction so sides of cubes remain black/dark.

我是否必须使用多个灯才能点亮所有东西?或者我能不能以某种方式反射地面/物体的光线?

Do I have to use multiple lights so everything is lit up? Or could I somehow reflect light off the ground/objects?

推荐答案

是的，您必须使用多个灯光来实现这一点，从而伪造反射光.计算真实反射光不是内置的(并且计算非常复杂/昂贵).您有多种选择.

Yes, you'll have to use multiple lights to achieve this, faking the reflected light. Computing real reflected light isn't built in (and computationally very complex/expensive). You have a variety of options.

第二个定向灯可以始终位于太阳的相反位置和方向.

A second directional light that could always be in the opposite position and direction of your sun.

保持恒定的半球光.半球照明具有天空颜色和地面颜色和强度，并为您的照明增加了一些额外的深度.

A hemisphere light that remains constant. Hemisphere lighting gets a sky color and a ground color and intensity and adds a nice extra bit of depth to your lighting.

//                                    sky color ground color intensity 
hemiLight = new THREE.HemisphereLight( 0x0000ff, 0x00ff00, 0.6 ); 

这是一个工作示例 http://mrdoob.github.com/three.js/examples/webgl_lights_hemisphere.html

您可以使用不同灯的任意组合，但要注意性能上的折衷.

you could use any combination of different lights but be careful there's a performance trade off.

还值得一提的是半朗伯着色，它通过在您的材质中将 wrapAround 属性设置为 true 来启用.这为黑色提供了更好的衰减，从而减少了刺眼的照明.更多的中间色调和更少的黑色.

It's also worth mentioning half-lambert shading which is enabled by setting the wrapAround property to true in your material. This gives a nicer falloff to black that results in less harsh lighting. More mid tones and less blacks.

这篇关于Three.js 的真实照明(阳光)?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！