Hi,
I am experiencing weird behaviour of casted shadow on the plane. The result I am getting is like this:
As you can see, the shadow of the model (dog) is being cut off in front and at the back. Also there is no shadow being cast from the back left foot.
The object has only one mesh, which is in one group and all of them are set to cast shadow.
I am adding the lights to the scene like so:
const directional = new THREE.DirectionalLight(0xFFFFFF, 0.4, 100);
const light = new THREE.HemisphereLight(0xffffff, 0xb3858c, 0.9);
directional.position.set( 8, 8, 2 );
directional.castShadow = true;
this.scene.add(directional);
this.scene.add(light);
And then I am adding the object and the plane to the scene like so:
scene.loadModel('model/untitled.gltf', (model) => {
// Iterator through the model's children
model.traverse((child) => {
if (child instanceof THREE.Mesh) {
// reset original material
child.material.map = null;
// cast shadow
child.castShadow = true;
child.receiveShadow = true;
}
});
model.castShadow = true;
model.receiveShadow = true;
scene.add(model);
const modelBox = new THREE.Box3().setFromObject(model);
const modelSize = modelBox.getSize(new THREE.Vector3());
const modelcenter = modelBox.getCenter(new THREE.Vector3());
const planeMaterial = new THREE.MeshStandardMaterial({ color: 0xc0c0c0 });
const planeGeo = new THREE.PlaneBufferGeometry(40, 40, 32, 32);
const plane = new THREE.Mesh(planeGeo, planeMaterial);
plane.receiveShadow = true;
plane.rotation.x = -Math.PI / 2;
plane.position.set(0, -((modelSize.y / 2) - modelcenter.y), 0);
scene.add(plane)
});
Why is the shadow being cut off like that? Thanks for any help.