[solved] How to animate the position of a gltf model




I’m trying to animate the position of the gltf snowman model.
I can animate different meshes in function animate() but if I try do to that for my gltf model, it won’t work.

If I try: if ( gltf.scene.position.x >= targetPositionX5) { gltf.scene.position.x -= 0.0032;} it says “gltf is not defined at animate”

and if I try if (scene.position.x >= targetPositionX5) { scene.position.x -= 0.0032;} it animates the other meshes again too (which I don’t want).

I’ve also looked at How to rotate a gltf model in a specific direction but that did not work for me either.

Can someone help me?


If you comment in your animation code, you get the following error:

pen.js:96 Uncaught ReferenceError: gltf is not defined

The problem is that you try to access a variable which is out of scope. gltf only exists in the onLoad() callback of GLTFLoader.load(). I have fixed your code my defining a global variable model and assigning gltf.scene to it. I use this variable in the animate() function like so:

if ( model && ( model.position.x >= targetPositionX5 ) ) {

    model.position.x -= 0.0032;


Updated codepen: https://codepen.io/anon/pen/mQVeKQ


Thanks for the help!