GLB File is not displayed completely

Questions
1

I have a problem in displaying a group of models saved as ONE glb-file.
In detail a robot arm on a desk with a toolboox on it.

When I open the file in CAD Assistant every part of the model is shown. In three.js it isnt.
Therefore I looked at the objects children of the GLB-file and the console.log does not show every part of the model? - So it seems it is not a camera issue.

The interesting part is that only parts which are animated (robot arm) are shown. The desk and toolbox are invisble.

init() Function - Excerpt

function init() {

[...]

* Load 3D - Model */

   let loader = new THREE.GLTFLoader();
   loader.load('models/Merged.glb', function (gltf) {
                
       kuka = gltf.scene.children[0];
       
       // Load animation from glb file
       mixer = new THREE.AnimationMixer( kuka );
       mixer.clipAction(gltf.animations[0]).play();
				
       //
      scene.add(kuka);
      animate();
});

animation() function

function animate() {
   requestAnimationFrame(animate);
            
   light.position.set ( 
       camera.position.x + 10,
       camera.position.y + 10,
       camera.position.z + 10,
    );
            
    // Enable Animation
    if (!isPlay) {
       clock.running = false
    }

   else {
     const delta = clock.getDelta();
     mixer.update( delta );
     }
            
   renderer.render(scene,camera);
}
2

Do you mind sharing the glTF asset in this topic?

4

I’ve imported the asset into the three.js editor and applied a HDR environment map. The result looks like so:

image
image1400×1604 96.5 KB

It seems all components of the model are visible. Or is something missing?

5

This looks completely fine. Does the animation of the robot work?

This is how it looks in my Three.js application
Bildschirmfoto 2022-03-16 um 11.06.52

6

Yes, it does.

It seems you have to share your code since there is something wrong in your app.

7

Thanks a lot for your effort. Just updated the issue with my code.

8

Try it like so:

kuka = gltf.scene;
mixer = new THREE.AnimationMixer( kuka );
1 Like
9

I have similar example please ask if you have a question

1 Like