0

I've been stuck on this for a couple of hours, now.

I'm looking to load in .GLTFs via a Drop Down Menu. Problem is that I cannot seem to get the "already selected" option to go away. So, I end up with two models superimposed, since the old one won't go away. Here's an image of what's happening: https://i.imgur.com/bxB1uFJ.png

I have a feeling that this is as simple as one "scene.traverse..." function. But, alas, can't seem to quite figure this one out. I copied what I assumed was the most pertinent lines of code below. Let me know if anything else (like, animate() loop?) is needed.

Thank you for helping a beginner.


// LOAD FROM DDL  

var params = { Model: 'models/relic_progress_silver.glb' };
var ModelList = {
        'Silver': 'models/relic_progress_silver.glb',
        'Gold': 'models/relic_progress_gold.glb',
    };

gui.add(params, 'Model', ModelList)
.onChange(function() { ModelLoad(); });

const Right_Rotate = new THREE.Object3D( );
function ModelLoad()
    {
        const Right_loader = new GLTFLoader();
        Right_loader.load( params.Model,
            function (gltf) {

                   // Perhaps a gltf.scene.traverse(function (child)) here?

                    const box = new THREE.Box3( ).setFromObject( gltf.scene );
                    const center = box.getCenter( new THREE.Vector3( ) );
                    const size = box.getSize( new THREE.Vector3( ) ); 
                    gltf.scene.position.set( -center.x, size.y / 2 - center.y, -center.z );
                    
                    Right_Rotate.add( gltf.scene );
                    Right_Rotate.scale.set( Bond_Scale, Bond_Scale, Bond_Scale );
                    
                    Right_Rotate.position.x = -1.0;  // Bond X-coord
                    Right_Rotate.position.y = 0.6;   // Bond Y-coord
                    Right_Rotate.position.z = 0.4;   // Bond Z-coord 

                    scene.add( Right_Rotate );

            })
    };
  • Solved. Was just about to go to bed and found this (https://stackoverflow.com/questions/29417374/threejs-remove-all-together-object-from-scene) Answer: Add "while (object.children.length) {object.remove(object.children[0]); }" – Derek Hettinger Feb 13 '22 at 08:55

0 Answers0