Uso el modelo glb de importación GLTFLoader, sin embargo, raycaster no funciona.

He estado buscando durante mucho tiempo y todavía no puedo encontrar la respuesta.

Mi código :

 var ourObj; const loader = new GLTFLoader() loader.load('assets/fan.glb', function (glb) { //import glb const root = glb.scene; ourObj = root; root.name = 'bulb'; root.scale.set(10, 10, 10); //root.userData.draggable = true root.userData.name = 'CASTLE' scene.add(root); }, function (xhr) { //xhr console.log("xhr"); }, function (error) { //error console.log("error"); }) const raycaster = new THREE.Raycaster(); //raycaster const mouse = new THREE.Vector2(); //var draggable = THREE.Object3D; function onMouseMove( event ) { //event mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1 ; mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1 ; } window.addEventListener( 'mousemove', onMouseMove,false); function hoverPieces(){ raycaster.setFromCamera(mouse, camera); const intersects = raycaster.intersectObjects(scene.children); console.log(scene.children); //console console.log(intersects); for ( let i = 0; i < intersects.length; i ++ ) { intersects[ i ].object.material.color.set( 0xff0000 ); } } var render = function () { hoverPieces() renderer.render(scene, camera); requestAnimationFrame(render); }; render()

resultado de la consola:

como puedo usar lo ?