Geometries and Meshes - Three.js - page 74

control.rotationSpeedX;
pivotPoint.rotation.y +=
control.rotationSpeedY;
pivotPoint.rotation.z +=
control.rotationSpeedZ;
requestAnimationFrame(render);
}
How it works...
When you create THREE.Mesh in Three.js, you normally just add it to THREE.Scene
and position it individually. In this recipe, however, we've made use of the
THREE.Mesh feature, which extends from THREE.Object3D itself and can also
contain children. So when the parent object is rotated, this will also affect the chil-
dren.
A really interesting aspect of using the approach explained in this recipe is that we
can now do a couple of interesting things:
• We can rotate the box itself by updating the cube.rotation property like
we did in the Rotating an object around its own axis recipe
• We can also rotate the box around the sphere by changing the rotation prop-
erty of the sphere, as we added pivotPoint as a child of the sphere mesh
• We can even combine everything, we can rotate pivotPoint ,
sphereMesh , and cube —all separately—and create very interesting effects
See also
In this recipe, we've used the fact that we can add children to meshes as a way to
rotate an object around another object. However, after reading the following recipes,
you will learn more about this:
• In the Rotating an object around its own axis recipe, we showed you how you
can rotate an object around its own axis