Graphics Reference
In-Depth Information
function explode(outwards) {
var dir = outwards === true ? 1 : -1;
var count = 0;
cube.vertices.forEach(function(v){
v.x+=(avgVertexNormals[count].x *
v.velocity * control.scale)*dir;
v.y+=(avgVertexNormals[count].y *
v.velocity * control.scale)*dir;
v.z+=(avgVertexNormals[count].z *
v.velocity * control.scale)*dir;
count++;
});
cube.verticesNeedUpdate = true;
}
The control.scale variable is set through GUI and determines the speed
at which our geometry expands, and the dir property is based on whether
we want to move the points outwards or inwards. The verticesNeedUp-
date property is required to inform Three.js about these changes.
5. Now all that is left to do is call the explode function from the render loop:
function render() {
renderer.render(scene, camera);
explode(true); // or explode(false)
requestAnimationFrame(render);
}
There's more
In this example, we've used a standard geometry; you can, of course, also use an
externally loaded model.
Search WWH ::




Custom Search