How to position bones in a three.js colladaloader object (skeletal animation)

Question

I've loaded a biped character mesh using colladaloader.

I can move the mesh by changing the position and rotation on the dae object.

dae.rotation.y+=0.01;
dae.updateMatrix();

works fine

But I can't seem to move individual bones.... any idea how do go about this?

dae.children[0].rotation.z += 0.1;
dae.children[0].quaternion._x += 0.1;
dae.children[0].position.x += 0.1;
dae.children[0].matrixAutoUpdate = true;
dae.children[0].matrixWorldNeedsUpdate = true;
dae.children[0].updateMatrix();

does not work

Entire project:

https://codenvy.com/ide/tmp-9q4s6enl9imzzs

Run link: (may change as people update / rerun the project)

http://app-slm37q4a3tzdf3c7.apprun4.codenvycorp.com/

(changes every time someone does a Run > Run application so no point having the run url listed here..)

Answer 1

It's not as simple as I hoped. There is a hierarchy of objects created by the loader however moving them about does not affect the vertices of the geometry.

The processes that must be implemented is known as "Skinning Equations" to tranform vertex geometry using weighted bone orientation as well as other matrices.

also refer to: COLLADA: Inverse bind pose in the wrong space?

Answer 2

In your function animate you need to add this before calling render(): requestAnimationFrame(animate); At the moment you're rerunning the function animate even before you make the changes to the bones. So obviously nothing is moving. It's all about order of the code.

If that doesnt work could you tell me if you have an error in your console?

Answer 3

I wanted to make this answer a comment on the original question, as it's a suggestion to eliminate the issue with the Codenvy app run changing URLs for every click. The URL pasted into the response is a temporary workspace URL. So once the project is idle for 10 minutes that workspace will be destroyed. If the user who posted this project can copy their project into their account workspace, there is an option there called "Share->Factory" which will generate a URL that is a) permanent, and b) will create a fully cloned workspace for each person who clicks on it. If you send us the files or share your account, we can create the factory that can be added to the original question so all viewers see a fully functional clone.