Dynamic bones animation in Three.js
javascript, three.js
Solution
Yes, you can! You need to set `mesh.skeleton.bones[i]`, both `mesh.skeleton.bones[i].rotation` and `mesh.skeleton.bones[i].position`. Rotation is of type `Euler`. Position is of type `Vector3`. I have actually tested this using my code from here https://github.com/lucasdealmeidasm/three-mm3d (that includes a working skinned mesh with bone-attachable objects) and one can indeed do that.
Note that Inateno's answer is very wrong, there are many instances where this is necessary. For example, in a FPS, one uses both dynamic and non-dynamic animation. When a character runs and holds a gun, the direction he points the gun at is dynamically set (one could use mesh.skeleton.bones[i].rotation where "i" is the index for bone assigned to the arm for that) while the rest of the animation, including the walking, is made in the editor and loaded. One can, in three.js, use "THREE.AnimationHandler.update(delta);" and then change single bones' position and rotation in code to solve those issues.
Problem
Is it possible to create a dynamic animation by applying transformations to the bones of a 3D model using three.js? I tried moving and rotating the bones of a SkinnedMesh, but the mesh was not updated. ``` loader = new THREE.JSONLoader(); loader.load('/JS-Projects/Virtual-Jonah/Modelos/initialPose.js',function jsonReady( geometry ) { mesh = new THREE.SkinnedMesh( geometry, new THREE.MeshNormalMaterial({skinning : true}) ); mesh.scale.set( 10, 10, 10 ); mesh.position.z = mesh.position.y = mesh.position.x = 0; mesh.geometry.dynamic = true; scene.add( mesh ); var index = 0; for (var i = 0; i < mesh.bones.length; i++) { if (mesh.bones[i].name == "forearm_R") { index = i; break; } } setInterval (function () { mesh.bones[index].useQuaternion = false; mesh.bones[index].position.z += 10; mesh.bones[index].matrixAutoUpdate = true; mesh.bones[index].matrixWorldNeedsUpdate = true; mesh.geometry.verticesNeedUpdate = true; mesh.geometry.normalsNeedUpdate = true; renderer.render(scene, camera); }, 33); renderer.render(scene, camera); }); ``` The model I am using was created with makeHuman (nightly build), exported to Collada, imported in Blender and exported to the three.js JSON model. The link to the model is the following: https://www.dropbox.com/sh/x1606vnaoghes1y/gG_BcZcEKd/initial Thank you!