Moving forward: Cylinder


Cylinder is much more difficult to implement than the other polygon-based 3D objects. Polygon is still polygon after 3d projection, but the circle is mapped to ellipse and the we need to draw the the outline of surface by all means.

First thing first, we may reuse the cap later, so we introduce the dojox.gfx3d.Orbit, which is the Circle in the 3D space, the first challenge is how to map the X-Y plate circle to the 3D space orbit? We know the new center, the semi major (this may not be true if the projection includes any scale of X, Y, Z axis), and marks which are the projection of arbitrary points in the original circle. The algorithm is inspired bythis mathematic lecture.

  1. The general equation is: ax2+2bxy+cy2+dx+ey+f=0ax^2 + 2bxy + cy^2 + dx + ey + f = 0, we can normalize the marks according to the new center, the equation is reduced as: ax2+2bxy+cy2+f=0ax^2 + 2bxy + cy^2 + f = 0
  2. Let a = 1, the other parameters are determined by marks.
  3. The rotation angle, theta, is defined as θ=atan(2b,ac)/2\theta = atan(2b, ac) / 2.
  4. Then we can rotate the normalized mark by θ-\theta to get the canonical equation: x2a2+y2b2=1\frac{x^2}{a^2} + \frac{y^2}{b^2} = 1.
  5. Using the marks again to find out aa and bb, which are the rxrx, and ryry.


The draw procedure would create a Ellipse on (0,0)(0, 0) with rx=a,ry=brx = a, ry = b, rotate θ\theta, then transpose to the center.

We could not use the Scene to simplify Cylinder drawing, since the curved surface is not a fixed rectangle. We draw the further cap first, then draw a rectangle with width of distance of two caps, height of major radius. A easier approach is to draw the path in (0, 0), rotate theta and transpose to the new center.

One picture is worthy the above. As usual, here is the snapshot.