Weird shadows on collada model

After import collada model i see weird low res shadows.

const color = '#ffffff';
const intensity = 1.5;
const light = new THREE.SpotLight(color, intensity);
light.position.set(-40, 60, 80);
light.castShadow = true;
light.receiveShadow = true;
light.shadow.mapSize.width = 1024; // default is 512
light.shadow.mapSize.height = 1024; // default is 512

var loader = new ColladaLoader();
loader.load('models/venice-16.dae', function (result) {
var model = result.scene;	
model.traverse(function(child) {
child.castShadow = true;
child.receiveShadow = true;


you should have a look at the and set the area where shadows shall happen as small as possible. You can use a helper for this to see the frustum where shadows will be rendered. There are many examples and tutorials about shadow maps:

A small shadow area makes smaller shadow maps possbile and will be more performant.

To remove remaining artifacts you can change the shadows bias in tiny steps like -0.0001.

1 Like