gltf 모델에 그림자 투사방법

three.js 에서 glTF 모델을 불러올 때 아래와 같이 코딩하면 그림자가 적용되지 않습니다.

var model = new THREE.GLTFLoader();
model.load('https://threejs.org/examples/models/gltf/Duck/glTF/Duck.gltf', function(gltf) {scene.add(gltf.scene);});
model.castShadow = true;

// 그림자가 적용되지 않음

 

이럴때는 아래와 같이 각 하위 Mesh에 설정해야 합니다.

var loader = new THREE.GLTFLoader();
loader.load( 'https://threejs.org/examples/models/gltf/Duck/glTF/Duck.gltf', function( gltf ) {
    gltf.scene.traverse( function( node ) {

        if ( node instanceof THREE.Mesh ) {
        	node.castShadow = true;
        	node.receiveShadow = true;
        }

    } );
    scene.add( gltf.scene );
} );

// 그림자가 적용됨

 

출처 : https://stackoverflow.com/questions/49869345/how-to-cast-a-shadow-with-a-gltf-model-in-three-js