My GTLF imported models can't both cast and receive shadows

Questions
1

I’ve imported a GTLF scene from Blender, and it seems like my models can either cast a shadow, or receive a shadow, but cannot do both. When both castShadow and receiveShadow are set to true, the model only casts a shadow. However, if I unset castShadow, the model will properly receive shadows.

Image showing two models, one only casting a shadow, and one only receiving a shadow
Image showing two models, one only casting a shadow, and one only receiving a shadow311×706 35.2 KB

The example image shows two models, the top one has receiveShadow = true and castShadow = false, while the bottom one has both set to true. For the top one, a shadow properly shows for items sitting on top of the model, but for the bottom it does not, even though the shadow is received by the “wall” model. Changing castShadow = true for the top model makes it cast a shadow, but no longer receive it.

Ideally both models would be able to both cast and receive shadows, but I’m not sure what might be causing the problem here. Is there someway I can make these objects both cast and receive shadows?

Relevant code:

// Renderer properties
renderer.gammaOutput = true;
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = Three.PCFSoftShadowMap;

// Light Setup
const ptLight2 = new Three.PointLight( WHITE, 0.8, 70 );
ptLight2.position.set( 0.5, 6, 0 );
ptLight2.castShadow = true;
ptLight2.shadow.bias = 0.0001;
scene.add( ptLight2 );
helper = new Three.PointLightHelper(ptLight2);
scene.add(helper);
scene.add( new Three.CameraHelper( ptLight2.shadow.camera ) );

// Model Loader
gltfLoader.load("/images/room.glb", (gltf) => {
	const root = gltf.scene;
	scene.add(root);
	root.traverse(obj => {
		if(obj.isMesh) {
			// Outside view things don't need to cast shadows
			if(!obj.name.includes('Floor') && !(obj.name.includes('Wall') && !obj.name.includes('Shelf')) && !obj.name.includes('Door')) {
				obj.castShadow = true;
			}
			obj.receiveShadow = true;
		}
	});
});

Object log from browser console

Screenshot of console log with Object dump
Screenshot of console log with Object dump1126×397 14.8 KB

UPDATE: Commenting out ptLight2.shadow.bias = 0.0001;seems to allow both casting and receiving, but causes significant artifacts in the shadows and across the render.

Image showing artifacts after removing shadow bias
Image showing artifacts after removing shadow bias331×611 86.7 KB

2

First think I’d try is to double-check in Blender (or another 3D software) if the faces on the shadow-receiving surfaces are pointing in the right direction.

3

Thanks for the response. Just double checked and all the normals on the object are facing the correct way.

(Added an update, but commenting out ptLight2.shadow.bias = 0.0001; makes the shadows work, but causes significant artifacts across the whole render so I’m not able to just turn that off)

4

hello,
for artefact may be , if not done yet , check backface culling to avoid artefact .

5

Ah, that was it! That actually fixed both issues. Thanks!