Mismatch in Mixamo Animation on GLB and FBX

Questions
1

Given:

GLB model:
https://filebin.net/dhg1twa6s8tg1qzf/oldman.glb

Same model imported into Blender and exported as FBX for Mixamo (since mixamo doesn’t support gltf):
https://vkzs9f.csb.app/oldman.fbx

Imported the model into Mixamo with selected second “Looking Around” animation:

image
image1920×1024 114 KB

I downloaded the “Looking Around.fbx” animation without skin and apply it in my react three fiber scene:

function Model({ url, animation, ...rest }) {
  const { nodes, scene } = useGLTF(url)
  const actions = useFBX(animation)
  const mixer = useRef(new AnimationMixer())
  useFrame((state, delta) => {
    mixer.current.update(delta)
  })
  useEffect(() => {
    if (actions.animations && actions.animations.length) {
      actions.animations.forEach((clip) => {
        mixer.current.clipAction(clip, scene).play()
      })
    }
  }, [actions, nodes])
  return <primitive {...rest} object={scene} />
}

Check the demo here: https://codesandbox.io/p/sandbox/react-three-fiber-boilerplate-usegltf-forked-vkzs9f?file=%2Fsrc%2FApp.jsx%3A13%2C1-32%2C2

As you see the feet are moving around and the animation is not applied right - some offset can be seen. If you upload the oldman.fbx into Mixamo, you will see that it fits perfect - Question is: Is Blender doing something “wrong” on exporting the glb into fbx?

Any ideas? *edit: I just saw the warnings on the console:


 THREE.PropertyBinding: No target node found for track: Armature.quaternion. 
    at Model (https://vkzs9f.csb.app/src/App.jsx:17:5)
    at Suspense
    at ErrorBoundary (https://vkzs9f.csb.app/node_modules/@react-three/fiber/dist/index-6662eaf2.esm.js:501:5)
    at FiberProvider (https://vkzs9f.csb.app/node_modules/its-fine/dist/index.js:115:1)
    at Provider (https://vkzs9f.csb.app/node_modules/@react-three/fiber/dist/index-6662eaf2.esm.js:1629:27)
 THREE.PropertyBinding: No target node found for track: Armature.quaternion.
 THREE.PropertyBinding: No target node found for track: RootNode1.position. 
    at Model (https://vkzs9f.csb.app/src/App.jsx:17:5)
    at Suspense
    at ErrorBoundary (https://vkzs9f.csb.app/node_modules/@react-three/fiber/dist/index-6662eaf2.esm.js:501:5)
    at FiberProvider (https://vkzs9f.csb.app/node_modules/its-fine/dist/index.js:115:1)
    at Provider (https://vkzs9f.csb.app/node_modules/@react-three/fiber/dist/index-6662eaf2.esm.js:1629:27)
 THREE.PropertyBinding: No target node found for track: RootNode1.position.
 THREE.PropertyBinding: No target node found for track: RootNode1.quaternion. 
    at Model (https://vkzs9f.csb.app/src/App.jsx:17:5)
    at Suspense
    at ErrorBoundary (https://vkzs9f.csb.app/node_modules/@react-three/fiber/dist/index-6662eaf2.esm.js:501:5)
    at FiberProvider (https://vkzs9f.csb.app/node_modules/its-fine/dist/index.js:115:1)
    at Provider (https://vkzs9f.csb.app/node_modules/@react-three/fiber/dist/index-6662eaf2.esm.js:1629:27)
 THREE.PropertyBinding: No target node found for track: RootNode1.quaternion.
2

when you upload a model to mixamo, it will replace the skeleton based on the joints you set during the import.

The animation you download, is matched to the skeleton that your Mixamo import process created.
You will also need to download the updated skin, since the animation is matched to the new skeleton within it.

You can either download them as one, (skin and animations) or separately. As I often do, since I find it more versatile, and then join them in the code.

Example,

3

thx seanwasere! I noticed that mixamo is changing the names of the armature nodes:

Original node names:
image

and Mixamo changes the names, it removes “.001” from Armature and adds “1” to the RootNode.

Unfortunately my pipeline doesn’t allow me to download the skin as well from Mixamo.

  • I have an avatar generator, which gives me glb files (like the structure in the blender screenshot).

  • I predownload some Mixamo fbx animations (skinless) and apply them on my many different generated (same topology) avatars.

    Is it somehow possible to rename the armature and bone names per code so that the fbx animation can be applied?

4

When you load the animation, the tracks are an array of objects containing names, times and values related to bones, positions and quaternions.

Maybe you could write something fancy to re-rename the armatures/bones back to what they were before.

image
image1156×425 107 KB

1 Like
5

Haha, indeed! I’ve whipped up a nifty little function that waltzes through the model and renames those bones with the finesse of a seasoned sorcerer. The animations are now bewitched to follow suit. Magic! :sparkles::magic_wand:

  scene.traverse((mesh, i) => {
      if (mesh.name.startsWith('Armature.')) {
          mesh.name = 'Armature';
      }
      if (mesh.name.startsWith('RootNode')) {
        mesh.name = 'RootNode1';
      }
  })

and yes all the animations work on any of my avatars now. :man_mage::sparkles:

1 Like
6

Hey, I have been facing the same issue and this is my code:
Can you please let me know what part I can modify to rename the bones, I am new to this
/*
Auto-generated by: GitHub - pmndrs/gltfjsx: 🎮 Turns GLTFs into JSX components
*/

import React, { useEffect, useRef } from “react”;
import { useAnimations, useFBX, useGLTF } from “@react-three/drei”;

export function Avatar(props) {
const group= useRef();
const { nodes, materials } = useGLTF(“models/65a2830fedd978fd4b4547bf.glb”);
const{animations: lostanimation}=useFBX(“animations/Capoeira.fbx”);
console.log(lostanimation);
lostanimation[0].name=“LostAnimation”;
const {actions}=useAnimations(lostanimation,group);
useEffect(()=>{
actions[“LostAnimation”].reset().play();
}, );
return (
<group {…props} ref={group} dispose={null}>











);
}

useGLTF.preload(“models/65a2830fedd978fd4b4547bf.glb”);

1 Like
7

try to post your question again.