1

I am working on light and shadow part on Box Geometry. I am using Directional light with some intensity but when I reduce the intensity, plane is getting dark and the shadow intensity remains the same.

     let minPosition = this.map(max, 10, 1000, 30, 50);
     let maxPosition = this.map(max, 10, 1000, 40, 50);

     this.root.remove(this.light.shadow.camera);
     this.scene.remove(this.light);
     this.scene.remove(this.camera);

     this.light.position.set(0, minPosition, maxPosition);
     this.light.castShadow = true;
     this.light.intensity = 1.6;
     this.light.shadow.camera.top = 16; // default
     this.light.shadow.camera.bottom = -6; // default
     this.light.shadow.camera.right = 10; // default
     this.light.shadow.camera.left = -10; // default
     this.light.shadow.autoUpdate = true;
     this.scene.add(new THREE.CameraHelper(this.light.shadow.camera));
     this.root.add(this.light.shadow.camera);
     this.root.add(this.cube);
     this.root.add(this.globalLinesegs);
     this.scene.add(this.root);
     this.renderer.render(this.scene, this.camera);
     this.renderer.shadowMap.enabled = true;
     this.renderer.shadowMap.needsUpdate = true;
     this.renderer.castShadow = true;
     this.camera.add(this.light);
     this.scene.add(this.light);

enter image description here

any suggestion is greatly appreciated.

4 Answers4

0

three.js does not support to set an intensity or darkness value for shadows.

The workaround so far is the usage of an ambient light to modulate the shadow intensity. However, this will bright up the entire scene so it's possible to use this approach in all use cases.

Mugen87
  • 28,829
  • 4
  • 27
  • 50
0

As Mugen87 said, it is not possible to alter the shadow's darkness directly.

You can however add other lights to make the shadows and lighting more realistic. Checkout Ambient Light for a simple "all-round" light, that will light up the scene from any direction, in turn making the shadow appear brighter. There is also Hemisphere Light which is slightly more compilcated but can give a pretty good results and make a big difference in your scene lighting.

Here is an example from ThreeJS site too: Hemisphere Light demo

szym.mie
  • 1
  • 2
0

You can use Hemisphere light to reduce the shadow darkness. even Directional light has the property (shadow.radius) in which you can set the intensity but that will make the shadow dirty so Hemisphere light is the best option

0

In three.js, when you use Directional light and adjust the intensity, it has the impact over entire material used. I have used a trick over this that use two Directional lights and then adjust the intensity will change the shadow Darkness.

light = new THREE.DirectionalLight(0xfcfcfc, 0.3);
light.position.copy (this.scene.position) 
light.intensity = 1.3;


light1 = new THREE.DirectionalLight(0xfcfcfc, 0.3);
light1.position.copy (this.scene.position) 
light1.intensity = 1.7;