Search code examples
aframe

How do you access the skeleton of a gltf in Aframe

I have a gltf file with a skeleton rigged into it and I would like to move the bones of the skeleton manually. How hard is this to do in real time

Solution

  • Each bone in the skeleton is a THREE.Bone instance, and can be accessed by JavaScript in an A-Frame component:

    const mesh = el.getObject3D('mesh');
const bone = mesh.getObjectByName('LeftUpperArm');
bone.rotation.y = Math.PI / 4;

    The number of bones and their names will vary from model to model, so you may find it helpful to .traverse(...) the mesh and print the names of its bones for reference.

    So, it's not hard to simply move a bone in the skeleton, BUT you may find it inconvenient to move the bones in precise and natural-looking ways — particularly with a human skeleton. The rotations will involve a fair bit of math, and that math depends heavily on the particular skeleton you're working with. In general it is probably easier to do this type of animation in Blender, or to use an IK library (like THREE.IK).