Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to cast a shadow with a gltf model in three.js?

Tags:

three.js

gltf

Hey there i'm new to three js & was wondering how to cast a shadow with a gltf model? I can see it's possible as it's working here I assume i'm not structuring my code correctly-

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;

Here's the fiddle https://jsfiddle.net/steveham/ckpfwy24/87/

Cheers!

like image 614
Steve Hamlyn Avatar asked Apr 17 '18 03:04

Steve Hamlyn


1 Answers

You need to set castShadow = true on each child mesh, like so:

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.isMesh ) { node.castShadow = true; }

    } );

    scene.add( gltf.scene );

} );

three.js r.113

like image 61
WestLangley Avatar answered Nov 05 '22 19:11

WestLangley