# Issue importing Animations into R3F from ReadyPlayerMe via GLB

**URL:** <https://discourse.threejs.org/t/issue-importing-animations-into-r3f-from-readyplayerme-via-glb/59097>\
**Category:** Questions\
**Tags:** animation\
**Created:** [December 10, 2023, 8:07pm UTC](https://discourse.threejs.org/t/issue-importing-animations-into-r3f-from-readyplayerme-via-glb/59097 "2023-12-10T20:07:12Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![mandymozart](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mandymozart/32/42839_2.png) [@mandymozart](https://discourse.threejs.org/u/mandymozart)\
**Post date:** [December 10, 2023, 8:07pm UTC](https://discourse.threejs.org/t/issue-importing-animations-into-r3f-from-readyplayerme-via-glb/59097/1 "2023-12-10T20:07:12Z")

</div>

I exported a character from [readyplayer.me](http://readyplayer.me) as glb, which works fine in R3F.

I imported the model into Blender and transformed it into a FBX for mixamo.

After I selected the animations I liked I managed to export the model nicely with animations and it runs in the threejs Editor.

 ![bug_avatar-fine](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/3/7/37ffd2b630b98883bab1ca847fb6ceb6dabd189b.png)

4 meshes however fail to work in the R3F imported glb.  
 ![bug_avatar-fine-without-head-and-eyes](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/d/b/dbaec40880119213c71e2c5afb242df1fa564dfd.png)

```javascript
import { useAnimations, useGLTF } from '@react-three/drei'
import { useControls } from 'leva'
import React, { useEffect, useRef } from 'react'

export function AvatarWinter(props) {
  const group = useRef()
  const { nodes, materials, animations } = useGLTF('/models/avatar-winter.glb')
  const { actions } = useAnimations(animations, group)
  const { animation } = useControls("ANIMATION", {
    animation: {
      value: "Idle",
      options: Object.keys(actions)
    }
  })

  useEffect(() => {
    actions[animation].reset().fadeIn(0.5).play()
    return () => actions[animation].fadeOut(0.5)
  }, [animation])
  console.log(actions)
  return (
    <group ref={group} {...props} dispose={null}>
      <group name="Scene">
        <group name="Idle">
          <primitive object={nodes.Hips} />
          <skinnedMesh name="Wolf3D_Body" geometry={nodes.Wolf3D_Body.geometry} material={materials.Wolf3D_Body} skeleton={nodes.Wolf3D_Body.skeleton} />
          <skinnedMesh name="Wolf3D_Glasses" geometry={nodes.Wolf3D_Glasses.geometry} material={materials.Wolf3D_Glasses} skeleton={nodes.Wolf3D_Glasses.skeleton} />
          <skinnedMesh name="Wolf3D_Outfit_Bottom" geometry={nodes.Wolf3D_Outfit_Bottom.geometry} material={materials.Wolf3D_Outfit_Bottom} skeleton={nodes.Wolf3D_Outfit_Bottom.skeleton} />
          <skinnedMesh name="Wolf3D_Outfit_Footwear" geometry={nodes.Wolf3D_Outfit_Footwear.geometry} material={materials.Wolf3D_Outfit_Footwear} skeleton={nodes.Wolf3D_Outfit_Footwear.skeleton} />
          <skinnedMesh name="Wolf3D_Outfit_Top" geometry={nodes.Wolf3D_Outfit_Top.geometry} material={materials.Wolf3D_Outfit_Top} skeleton={nodes.Wolf3D_Outfit_Top.skeleton} />

          <skinnedMesh name="EyeLeft"
            geometry={nodes.EyeLeft.geometry}
            material={materials.Wolf3D_Eye}
            skeleton={nodes.EyeLeft.skeleton}
          />
          <skinnedMesh name="EyeRight"
            geometry={nodes.EyeRight.geometry}
            material={materials.Wolf3D_Eye}
            skeleton={nodes.EyeRight.skeleton}
          />
          <skinnedMesh name="Wolf3D_Head"
            geometry={nodes.Wolf3D_Head.geometry}
            material={materials.Wolf3D_Skin}
            skeleton={nodes.Wolf3D_Head.skeleton}
          />
          <skinnedMesh name="Wolf3D_Teeth"
            geometry={nodes.Wolf3D_Teeth.geometry}
            material={materials.Wolf3D_Teeth}
            skeleton={nodes.Wolf3D_Teeth.skeleton}
          />
        </group>
      </group>
    </group>
  )
}

useGLTF.preload('/models/avatar-winter.glb')

```

The skeleton on meshes error message is the following:

```javascript
Uncaught TypeError: Cannot read properties of undefined (reading 'length')
    at Object.update (three.module.js:17674:42)
    at setProgram (three.module.js:29744:18)
    at WebGLRenderer.renderBufferDirect (three.module.js:28645:20)
    at renderObject (three.module.js:29344:11)
    at renderObjects (three.module.js:29313:6)
    at renderScene (three.module.js:29182:36)
    at WebGLRenderer.render (three.module.js:28987:5)
    at Object.current (ContactShadows.js:84:10)
    at render$1 (index-5bde93f1.esm.js:1526:22)
    at loop (index-5bde93f1.esm.js:1553:19)

```

relating to the following line in threejs:

```javascript
let morphInfluencesSum = 0;

			for ( let i = 0; i < objectInfluences.length; i ++ ) {

				morphInfluencesSum += objectInfluences[i];

			}

```

Perhapse somebody got a pointer to what I have to change in my blender export? Thanks

 ![blender](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/0/1/01283cec3557f774febb5ed28568149b5b3970e8.png)

---

<div class="post-metadata">

**Author:** ![drcmda](https://avatars.discourse-cdn.com/v4/letter/d/91b2a8/32.png) [@drcmda](https://discourse.threejs.org/u/drcmda)\
**Post date:** [December 10, 2023, 8:52pm UTC](https://discourse.threejs.org/t/issue-importing-animations-into-r3f-from-readyplayerme-via-glb/59097/2 "2023-12-10T20:52:06Z")

</div>

i don’t see any obvious mistakes, unless there’s no actions called “Idle” which is the first you run.

- try it in some online gltf viewer and see if that can play the animations under the same names
- try `<primitive object={scene} />` instead of the jsx just to see if it’s that

a codesandbox would also help