# Multiple animations affecting the same object

**URL:** https://discourse.threejs.org/t/multiple-animations-affecting-the-same-object/30806
**Category:** Questions
**Tags:** animation
**Created:** [October 13, 2021, 6:43pm UTC](https://discourse.threejs.org/t/multiple-animations-affecting-the-same-object/30806 "2021-10-13T18:43:16Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![igarcioliver](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/igarcioliver/32/16301_2.png) [@igarcioliver](https://discourse.threejs.org/u/igarcioliver)
#### Post date: [October 13, 2021, 6:43pm UTC](https://discourse.threejs.org/t/multiple-animations-affecting-the-same-object/30806/1 "2021-10-13T18:43:16Z")

</div>

hi everyone.

I am loading a GLB model. Let’s say it is a box with many doors and a ball inside.  
I need to open the doors, keep them opened and then animate the ball, either by doing animation\_a (deflate the ball) or animation\_b (move the ball). you can also close the doors.

MY code for playing each animation is:

```javascript
    const clip = THREE.AnimationClip.findByName( clips, clip_name );
    const action = mixer.clipAction( clip );

    if (action) {
        action.clampWhenFinished = true;
        action.repetitions = 0;
        action.loop = false;
        action.paused = false;
        action.enabled = true;
        if (chap.action === 'close') {
            action.timeScale = -1;
        } else {
            action.timeScale = 1;
            action.time = 0;
        }
        
        action.play();

    }

```

but this is giving me weird end state. like the ball being deflated when I move it even I played the deflate animation backwards.  
so I added an eventListener ‘finished’ to the mixed and if the action was playing backwards, I reset it and stop.

But this makes me think I am missing something, the solution seems too convoluted.  
I have read the intro to the animation system and the mixers but I feel like I am missing something.

Any help/guidance will be appreciated.  
TIA

Ignacio

---

<div class="post-metadata">

### Author: ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)
#### Post date: [October 13, 2021, 7:05pm UTC](https://discourse.threejs.org/t/multiple-animations-affecting-the-same-object/30806/2 "2021-10-13T19:05:19Z")

</div>

Does the source code for this example help at all? [three.js examples](https://threejs.org/examples/#webgl_animation_skinning_morph) … it includes faded transitions between animations and should fully reset animations after they play.

It’s also worth noting that if two animations attempt to animate the same property of the same object (e.g. `ball.scale`) this will cause issues. You can list the track names in each clip to check for that.

---

<div class="post-metadata">

### Author: ![igarcioliver](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/igarcioliver/32/16301_2.png) [@igarcioliver](https://discourse.threejs.org/u/igarcioliver)
#### Post date: [October 15, 2021, 12:23pm UTC](https://discourse.threejs.org/t/multiple-animations-affecting-the-same-object/30806/3 "2021-10-15T12:23:31Z")

</div>

Thanks @donmccurdy this looks indeed helpful.

We do have the same property of the same object affected by two different animations.  
What would be the recommended approach in this case?

---

<div class="post-metadata">

### Author: ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)
#### Post date: [October 15, 2021, 3:33pm UTC](https://discourse.threejs.org/t/multiple-animations-affecting-the-same-object/30806/4 "2021-10-15T15:33:12Z")

</div>

That’s really case-specific, but if you have two tracks saying the same object should be in two locations, it can’t be in both. If one of those tracks is empty (e.g. just has `position=0,0,0` or `scale=1,1,1`) you could remove the track. If you want both to apply then there’s an option for additive animation.
