Loading a glTF model twice inside the loader.load();

Questions
,
1

Hello everyone ,

Is it possible to load an object twice , inside the loader.load() ?
What I mean by “load an object twice” , something like :

            loader.load('assets/models/scene.gltf', function ( gltf ) {

                    GLTF = gltf;
                    //gltf.scene.clone();//this isn't producing any errors but doesn't seems to work
                    gltf.scene.position.z = 7;
                    GLTF.scene.position.z = 1;
                    GLTF.scene.position.x = 2;

                    gltf.scene.scale.set(0.05,0.05,0.05);
                    GLTF.scene.scale.set(0.03,0.03,0.03);
                    //gltf.scene = gltf.scene + GLTF.scene //this is not working + produce error
                    world.add( gltf.scene );
                    world.add( GLTF.scene ); //this doesn't produce any error but doesn't seems to work

Hope the code above describes what I exactly want to achieve , if not then imagine a copy+paste Unreal Engine 4 3D object operation , that’s what I want to do : within the loader.load mechanism get the model and create it twice in the scene.

After some search on the internet , I’ve found some people that says this thing is impossible at this moment so I decided to try my luck here too.
What do you think?

Thank you for help!

2

What’re you’re looking for is Object3D.clone() which will copy all the data of an object and allow you to change them independently.

So your code would change to:

loader.load('assets/models/scene.gltf', function ( gltf ) {
    let copy = gltf.clone();

    gltf.scene.position.z = 7;

    copy.scene.position.z = 1;
    copy.scene.position.x = 2;

    gltf.scene.scale.set(0.05,0.05,0.05);
    copy.scene.scale.set(0.03,0.03,0.03);

    world.add(copy.scene);
    world.add(gltf.scene);
});
3

Note that you may need to use SkeletonUtils.clone( source ) if the model uses skinning animation. For example:

var source = gltf.scene;
var copy = THREE.SkeletonUtils.clone( source );
world.add( source );
world.add( copy );
2 Likes
4

Hi & thanks for reply !

@donmccurdy yes , my model is using animations , I’ll use that

@davidpox when I run :

let copy = gltf.clone();

I get this error :

TypeError: gltf.clone is not a function
at index:375
at GLTFLoader.js:84
at GLTFLoader.js:1591

The three.js version I’m using :
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/106/three.min.js"></script>
The GLTFLoader version I’m using :
<script src="https://cdn.rawgit.com/mrdoob/three.js/r106/examples/js/loaders/GLTFLoader.js"></script>

Those 2 glTF and THREE versions are the latest ones , I don’t think it’s a good idea to set them to an older version.What do you think?

5

Sorry, usually depends on your workflow. because you’re importing animations, you need to do gltf.scene.clone().

But as @donmccurdy said, you’ll want to use SkeletonUtils.clone(source); instead, because the standard Object3D.clone() doesn’t copy over Skinned meshes, bones, etc.

1 Like