A problem with DirectionalLight and shadow

Questions
,
1

Hello. I have a scene which I exported from Blender, with added light source AmbientLight and DirectionalLight, with shadows on.
The light and shadows appear incorrectly.

Scrypt code:
…
var renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize( window.innerWidth, window.innerHeight );
renderer.setClearColor( 0xFFFFFF );
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.PCFSoftShadowMap;
document.body.appendChild( renderer.domElement );
…
scene.add(new THREE.AmbientLight(0xCCCCCC));

var x = -1;
var y = 5;
var z = -5;

var dirLight = new THREE.DirectionalLight( 0xffffff, 1 );
dirLight.color.setHSL( 0.1, 1, 0.95 );
dirLight.position.set( x, y, z );
scene.add( dirLight );
dirLight.castShadow = true;
dirLight.shadow.mapSize.width = 1024;
dirLight.shadow.mapSize.height = 1024;

var d = 50;
dirLight.shadow.camera.left = -d;
dirLight.shadow.camera.right = d;
dirLight.shadow.camera.top = d;
dirLight.shadow.camera.bottom = -d;
dirLight.shadow.camera.far = 500;

var dirLightHeper = new THREE.DirectionalLightHelper( dirLight, 10 );
scene.add( dirLightHeper );
…

Please, where I did a mistake ?
Link to the scene http://pro-house.site:3012/test/light .

2

Your floor plane seems to be upside down, basically the normals have to face up.

To test in your material try:
new THREE.MeshBasicMaterial( {color: 0xffff00, side: THREE.FrontSide} );

If the plane will be invisible from top, but visible from below, just flip it. You also might adjust the shadow bias to something close to

light.shadow.bias = 0.0001;

Edit: I can’t tell what the floor is, it seems like a flat scaled cube, if that’s the case you probably overscaled it. It’s better to enable Backface culling in your modelling software.

3

The plane and all other models are correct and the normals are correct. If you looked closely, you should have seen where the light source is and how the light falls on objects. The plane has a material with double-sided mode. It’s not a matter of materials or models, especially. I’m sure.
I ask to help you figure it out. Pay attention to the position of the light source and how light falls on objects. I myself do not understand anything.

4

Floor is a simple plane. Normal is directed upwards.
This is a problem with light and shadows from here http://pro-house.site:3012/. It can be seen that all models are correct.
http://pro-house.site:3012/test/ligth - this link simplifies the display of the problem. It’s not a matter of model or material. In something else.

5

There is no reason to get grumpy.

They are not. As i said, i flipped the normals of your plane and raised the shadow bias to 0.001
https://s26.postimg.org/de8r9w0s9/image.png

That’s paradox.

6

I write messages in Russian through a google translator. I apologize if you feel something in my messages.
I have now updated the scene, but notice how the shadows and light fall on the objects when the light source is on the other side.

7

It sounds kinda robotic, Google Translator is awful, you could give deepl.com a shot.

The normals of your scene objects aren’t correct, maybe it’s just the flat shading, but it still looks like non-normalized values. In your modelling software you should be able to smooth/realign normals.

I called computeVertexNormals on the Suzanne model.
https://s26.postimg.org/aspv0io6x/suzanne.png

8

Thank you. I understand the reason.