# Accessing and use Collada animation data in three,js

**URL:** <https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961>\
**Category:** Questions\
**Tags:** collada-format, animation\
**Created:** [May 29, 2018, 2:22pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961 "2018-05-29T14:22:12Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![SmashTheScreen](https://avatars.discourse-cdn.com/v4/letter/s/9e8a1a/32.png) [@SmashTheScreen](https://discourse.threejs.org/u/SmashTheScreen)\
**Post date:** [May 29, 2018, 2:22pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/1 "2018-05-29T14:22:12Z")

</div>

Hello,

1. I created a textured and animated test model in Cinema 4D. ( A basic cube rotating for 1 second - 25 frames).
2. Successfully imported the DAE file into three.js.
3. Model geometry renders perfectly.
4. Baked textures render perfectly.
5. Animation… stuck.

I’ve researched multiple resources in an attempt to access and use the animation but was unsuccessful. I’ve found it difficult trying to work off of the three.js docs too. I need help to code the animation part in three.js.  
I have the HTML file and the Collada file available for perusal but not sure whether to post here in this window or send files directly somehow, any suggestion?

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [May 29, 2018, 3:31pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/2 "2018-05-29T15:31:03Z")

</div>

Please share the Collada file in this thread.

---

<div class="post-metadata">

**Author:** ![SmashTheScreen](https://avatars.discourse-cdn.com/v4/letter/s/9e8a1a/32.png) [@SmashTheScreen](https://discourse.threejs.org/u/SmashTheScreen)\
**Post date:** [May 29, 2018, 3:50pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/4 "2018-05-29T15:50:01Z")

</div>

[cubeTest copy.dae.zip](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/3/3598ad504698bc696016fb73d1533a33c6b558ad.zip) (2.2 KB)

---

<div class="post-metadata">

**Author:** ![SmashTheScreen](https://avatars.discourse-cdn.com/v4/letter/s/9e8a1a/32.png) [@SmashTheScreen](https://discourse.threejs.org/u/SmashTheScreen)\
**Post date:** [May 29, 2018, 4:00pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/5 "2018-05-29T16:00:54Z")

</div>

And my HTML code so thus far:

[1-FirstScene copy.html.zip](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/d/dfab07d1a92b5c8f1ad7c9b85a9a368bf08465cf.zip) (2.0 KB)

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [May 29, 2018, 5:08pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/6 "2018-05-29T17:08:23Z")

</div>

Pure keyframe animations are not supported by `ColladaLoader`. Try to convert your file to `glTF` and load it with `GLTFLoader` instead. You can use the following tool for the conversion.

> **[KhronosGroup/COLLADA2GLTF](https://github.com/KhronosGroup/COLLADA2GLTF)**
>
> COLLADA to glTF converter. Contribute to KhronosGroup/COLLADA2GLTF development by creating an account on GitHub.

---

<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:** [May 29, 2018, 5:28pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/7 "2018-05-29T17:28:20Z")

</div>

COLLADA2GLTF isn’t working for me on this one (I get an error — worth filing a bug, I suspect) but loading the DAE into Blender, setting playback range to 0-20, and exporting does give working animation.

Filed: [https://github.com/KhronosGroup/COLLADA2GLTF/issues/188](https://github.com/KhronosGroup/COLLADA2GLTF/issues/188)

---

<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:** [May 29, 2018, 5:52pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/8 "2018-05-29T17:52:29Z")

</div>

The issue using COLLADA2GLTF’s online hosted version was due to a missing texture in the DAE file. Running COLLADA2GLTF locally should work fine.

---

<div class="post-metadata">

**Author:** ![SmashTheScreen](https://avatars.discourse-cdn.com/v4/letter/s/9e8a1a/32.png) [@SmashTheScreen](https://discourse.threejs.org/u/SmashTheScreen)\
**Post date:** [June 4, 2018, 3:22pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/9 "2018-06-04T15:22:31Z")

</div>

Thanks guys I’m on Mac only at this stage and I notice glTF 2.2 Mac support is still in dev, so failing conversion of my original keyframe based Collada file to glTF, whats the next best option? I noticed Don mentioned the online converter and I did go to that site and spent a fair amount of time trying it, the model would upload and appear correctly in the screen but nothing else would happen, ie no glTF model was returned.  
Unless I’ve missed something it may be easier to continue learning Blender and export straight from there for models requiring animation in three.js? Any suggestions?

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [June 4, 2018, 3:49pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/10 "2018-06-04T15:49:40Z")

</div>

> [@SmashTheScreen](#):
>
> and I notice glTF 2.2 Mac support is still in dev

Do you refer to `COLLADA2GLTF`? It’s a little bit unfortunate that there are no compiled binaries for Mac. When I try to build the project on macOS, `make` reports several build errors ☹

Working with Blender might give you more flexibility. You can use the following tool to export your assets from Blender to `glTF`.

> **[GitHub - KhronosGroup/glTF-Blender-Exporter: Moved to...](https://github.com/KhronosGroup/glTF-Blender-Exporter)**
>
> Moved to https://github.com/KhronosGroup/glTF-Blender-IO. - GitHub - KhronosGroup/glTF-Blender-Exporter: Moved to https://github.com/KhronosGroup/glTF-Blender-IO.

---

<div class="post-metadata">

**Author:** ![SmashTheScreen](https://avatars.discourse-cdn.com/v4/letter/s/9e8a1a/32.png) [@SmashTheScreen](https://discourse.threejs.org/u/SmashTheScreen)\
**Post date:** [June 4, 2018, 3:54pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/11 "2018-06-04T15:54:01Z")

</div>

Yes correct COLLADA2GLTF.  
Yes I will do a Blender test. If people are getting working animations from the Blender export method it will be a viable solution to the animation problem.  
Thank you for the Blender glTF tool suggestion.

---

<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:** [June 4, 2018, 9:14pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/12 "2018-06-04T21:14:11Z")

</div>

The glTF Blender exporter or FBX2GLTF do support animation. COLLADA2GLTF MacOS support is being worked on.

---

<div class="post-metadata">

**Author:** ![merf23](https://avatars.discourse-cdn.com/v4/letter/m/e9c0ed/32.png) [@merf23](https://discourse.threejs.org/u/merf23)\
**Post date:** [June 5, 2018, 6:15pm UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/13 "2018-06-05T18:15:12Z")

</div>

Hi,

Correct me if i am wrong, but Blender export doesn’t support multiple animations … in 0 format.  
neither collada, neither GLTF

I am a bit disappointed… how to work with character ? ☹

thx

---

<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:** [June 6, 2018, 4:12am UTC](https://discourse.threejs.org/t/accessing-and-use-collada-animation-data-in-three-js/2961/14 "2018-06-06T04:12:27Z")

</div>

@merf23 you can use [this in-progress branch of the glTF Blender Exporter](https://github.com/KhronosGroup/glTF-Blender-Exporter/pull/166) that supports multiple animations, or Facebook’s FBX2GLTF. I believe `THREE.FBXLoader` also supports multiple animations. COLLADA2GLTF currently does not.