How to loop gltf animation let's say from 5 seconds to 15 if whole animation is 20 seconds

How to loop gltf animation let’s say from 5 seconds to 15 if whole animation is 20 seconds

there is a function AnimationUtils#subclip – three.js docs (threejs.org)

In my example link below, I use the walk animation which is 1 second long. If my demo is running at 60FPS then I can loop from .3 to .6 seconds by using frame numbers 20 → 40

Example : subclip

see lines 43-45

const walkAction = gltf.animations[6] // walk
const trimmedAction = THREE.AnimationUtils.subclip(walkAction, 'trimmedWalk', 20, 40);
mixer.clipAction(trimmedAction).play()
5 Likes

Thank you, it works.

I hate to jump into an old thread like this, but I’ve been searching and this is one of the few examples of the .subclip method that I’ve been able to find. Unfortunately, I’m trying to use it in 8th Wall’s AR platform, in which we have to load the .glb files via A-frame, then access them through javascript. The problem is I can’t figure out what I’m supposed to use in place of the “walkAction” part, since it looks like that’s instantiated with the loading of the glb/gtlf file. All I can call is the ID of the glb file, but that doesn’t work if I use that in the subclip function.