Graphics Reference
In-Depth Information
var loader = new THREE.JSONLoader();
loader.load("../assets/models/bones/
crow.js",function(model){
...
});
5. Once the model is loaded in Three.js. we can process it. The first thing we
do in the callback from the
loader.load
function is to set up the material:
var mat = new
THREE.MeshLambertMaterial({color:
0xf33f33,shading: THREE.FlatShading,
skinning:true})
This is just a standard
THREE.MeshLambertMaterial
object. The only
thing you need to make sure is to set the
skinning
property of the material
to
true
.
6. Now that we've got the model and the material, we can create a mesh. As
we're working with skeletons, we need to create
THREE.SkinnedMesh
:
mesh = new THREE.SkinnedMesh(model,
mat);
7. Next, we need to select the animation we want to play. For this, you use the
following code snippet:
model.animation = "Crow.ArmatureAction";
THREE.AnimationHandler.add(model.animations[0]);
var animation = new
THREE.Animation(mesh, model.animation );
animation.play();
You need to make sure the
animation
property contains the name of
an animation from the
model.animations
array. In this case, we've only
got one animation with the
Crow.ArmatureAction
name. Skeleton-based
animations are handled using
THREE.AnimationHandler
. So, we add