HTML and CSS Reference
In-Depth Information
index
0
index + 1
1
Figure 16-21.
The last face of the cylinder
These wind up as follows:
idx, 1, idx + 1
idx, 0, 1
The result is shown in Figure 16-22. If you want to make the construction of this shape a little clearer,
increase the
lineWidth
property of each
Triangle
object.
Figure 16-22.
The resulting 3D cylinder
Moving 3D solids
Moving a 3D solid is easy now that you have the
Point3d
class, just change its center with the
setCenter
method. You've already moved a shape on the z-axis, and it's the same for positioning on the x and y axis.
But let's take a quick look at what happens when you change those values. It's all in the
getScreenX
and
getScreenY
methods of the
Point3d
class:
Point3d.prototype.getScreenX = function () {
var scale = this.fl / (this.fl + this.z + this.cZ);