Transformations – translation, rotation, and scaling
We are off to a good start. Now, let's add two or more objects. If we don't want everything sitting in the same place, we need a way to position the objects in the vast universe of 3D space. The most common way is by using transformation.
Engage thrusters
We don't alter the original 3D object, but just apply some math to each point in the 3D mesh to rotate, translate (move), and/or scale the object, as follows:
<Scene> <Transform translation="-2 -3 -3" rotation=".6 .8 0 .5"> <Shape> <Appearance> <Material diffuseColor='0.9 0.6 0.3' /> </Appearance> <Box/> </Shape> </Transform> <Transform translation="2 2.5 1" rotation="0 0 1 -.5"> <Shape> <Appearance> <Material diffuseColor='0.3 0.9 0.6' /> </Appearance> ...
Get WebGL HOTSHOT now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
