Graphics Reference
In-Depth Information
this.doTranslation = function() {
// you have two options, either use
the
// helper function provided by
three.js
// new
THREE.Matrix4().makeTranslation(3,3,3);
// or do it yourself
var translationMatrix = new
THREE.Matrix4(
1, 0, 0, control.x,
0, 1, 0, control.y,
0, 0, 1, control.z,
0, 0, 0, 1
);
cube.applyMatrix(translationMatrix);
// or do it on the geometry
// cube.geometry
applyMatrix(translationMatrix);
// cube.geometry.verticesNeedUpdate =
true;
}
As you can see in the code, creating a custom matrix transformation is very
easy and requires only the following steps.
2. First, you instantiate a new THREE.Matrix4 object and pass in the values
of the matrix as arguments to the constructor.
3. Next, you use the applyMatrix function of either THREE.Mesh or
THREE.Geometry to apply the transformation to that specific object.
4. If you apply this on THREE.Geometry you have to set the ver-
ticesNeedUpdate property to true , as vertex changes aren't automatic-
ally propagated to the renderer (see the Informing Three.js about updates re-
cipe).
Search WWH ::




Custom Search