如何在 Three.JS 中创建定向光影? [英] How to create directional light shadow in Three.JS?

问题描述

是否可以从 DirectionalLight 创建阴影?

Is it possible to create shadows from a DirectionalLight?

如果我使用 SpotLight 那么我会看到一个阴影，但是如果我使用 DirectionalLight 它不起作用.

If I use SpotLight then I see a shadow, but if I use DirectionalLight it doesn't work.

推荐答案

是的，您绝对可以使用平行光来投射阴影.您需要确保您没有使用 MeshBasicMaterial，因为它们不支持阴影.改用 MeshLambertMaterial 或 MeshPhongMaterial.

Yes, you most definitely can use directional lights to cast shadows. You need to make sure you are not using MeshBasicMaterial as they don't support shadows. Use MeshLambertMaterial or MeshPhongMaterial instead.

您需要使用以下内容为渲染器启用阴影:

You need to enable shadows for the renderer with something along these lines:

renderer.shadowMapEnabled = true;
renderer.shadowMapSoft = true;

renderer.shadowCameraNear = 3;
renderer.shadowCameraFar = camera.far;
renderer.shadowCameraFov = 50;

renderer.shadowMapBias = 0.0039;
renderer.shadowMapDarkness = 0.5;
renderer.shadowMapWidth = 1024;
renderer.shadowMapHeight = 1024;

然后您必须为每个对象和每个灯光启用阴影投射和阴影接收，这样您就可以了

And then you must enable shadow casting and shadow receiving per object and per light so you would have

dirLight.castShadow = true;
object.castShadow = true;
otherObject.receiveShadow = true;

然后，如果将灯光和物体放置在适当的位置.dirLight 将导致 object 的阴影投射到 otherObject 上.

Then, if the light and objects are placed at appropriate positions. dirLight will cause the shadow of object to be cast against otherObject.

:这是一个工作演示，适用于任何人想做类似的事情.

: Here is a working demo for anyone looking to do something similar.

这篇关于如何在 Three.JS 中创建定向光影?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！