CODEWITHSUNDEEP
javascriptthree.js
Single Entity
Single Entity

Reputation: 3115

Shadow range for directional lights in three.js

In three.js the shadow calculation range for directional lights is defined based on a bounding box emanating out from the directional light source. Consequently, if I wish to restrict how far away shadows are calculated I restrict the geometry of the bounding box. So for example:

var directionalLight = new THREE.DirectionalLight( 0xffffff );
directionalLight.position.set( 50, 50, 50 );
directionalLight.intensity = 0.5;
directionalLight.castShadow = true;
directionalLight.shadowCameraLeft = -10;
directionalLight.shadowCameraRight = 10;
directionalLight.shadowCameraTop = 10;
directionalLight.shadowCameraBottom = -10;

Where the shadowCamera variables can be adjusted to how far from the light sources FOV the shadows are created. I wish for this bounding box to follow the user camera, so that the shadows are rendered to a set distance away from the camera.

Because the bounding box geometry is based on the position of the light relative to the scene's origin (or target) it is not possible just to move the bounding box to wherever the camera is to create the effect I want.

I instead attempted to move the light source with the camera assuming that the bounding geometry would be relative to the location of the camera. This doesn't work because I can't seem to set the target for the directional light, it is always attempting to point to the origin, so if I change the light position, it changes its direction essentially.

For example the following does nothing:

directionalLight.target.position.set(100,100,100);

If the above worked I could in theory move the directional lights position and target relative to each other to keep its angle constant and probably achieve what I want, but it doesn't work.

Any ideas how to create a shadow range or why the above doesn't work?

Upvotes: 2

Views: 4034

Answers (2)

WestLangley
WestLangley

Reputation: 104783

DirectionalLight.target is a property of the light, but it is not part of the scene graph, so the target's matrix is not being updated.

If, instead, you had an object in your scene as the target, there would be no problem.

light.target = myObject;

three.js r.73

Upvotes: 2

pprchsvr
pprchsvr

Reputation: 168

Try setting this flag to help with debugging:

directionalLight.shadowCameraVisible = true;

It also looks like you are not controlling some parameters, for instance:

directionalLight.shadowCameraNear = -10;
directionalLight.shadowCameraFar = 10;

Finally, I'm not sure what you mean by "does nothing", because 

directionalLight.target.position.set(x, y, z);

moves the light target for me, so maybe when you turn on shadowCameraVisible things will become more clear. I hope this helps.

Upvotes: 0

Related Questions