当前位置: 动力学知识库 > 问答 > 编程问答 >

javascript - ThreeJS - Point light shadow acting like a spot light

问题描述:

I have a scene with and ambient light and a point light, and I would like to have shadows underneath the meshes as in the picture, but there is a shadow area around the central part.

It looks like the point light is casting shadows as if it was a spot light.

If I reduce the light.position.z the gray area disappears but the position of the shadow changes (they are no more under the meshes).

I created a fiddle with the code: https://jsfiddle.net/ytmc6kxm/1/

How can I get rid of the gray area around the circle without reducing the distance?

Can I do that with a directional light?

Why don't I see any shadow with the directional light?

Thank you!

网友答案:

A directional shadow uses an orthographic projection, which requires a proper window. The default window from -5 to 5 does not cover your entire scene. Adding

light.shadow.camera.left = -300
light.shadow.camera.top = -300
light.shadow.camera.right = 300
light.shadow.camera.bottom = 300

makes shadows appear when using a directional light.

As for why the point shadow gets clipped, it seems to be a bug in three.js, related to this line in shadowmap_pars_fragment.glsl:

    // dp = distance from light to fragment position
    float dp = ( length( lightToPosition ) - shadowBias ) / 1000.0;

The scaling parameter puts everything in shadow that is more than 1000 units away from the point light. The other shadow types get the depth directly using projected coordinates in shadow space, so they don't have this overflow problem. Substituting SpotLight for PointLight "fixes" the problem. Why is the point light implemented like this? No idea. The correct way forward is to post an issue to the three.js guys.

分享给朋友:
您可能感兴趣的文章:
随机阅读: