Javascript "Matrix" Object Tests

Test 1 - "Shape" Objects, Scaling & Rotation

Testing out Shape objects, which store shapes as an array V of Vector3 vertices, and an array E of edges, which are pairs of vertex indices.

Each shape initially starts with an edge length of 1. Hold the mouse down to see the original size, without scaling.
The blue square is scaled by 0.5 and is rotating about the Y axis.
The red square is scaled by 0.4 and is rotating about the X axis.
The black triangle is scaled by 0.2 and is rotating about the Z axis.

The identity() function is used to initialize the matrix, and also to reset it in between transformations.

Test 2 - 3D Shape Objects in 2D

The original cube shape, and all transformations happen in 3D "model space", but the z-coordinates are effectively ignored by the Canvas object, and it is projected to 2D.

Test 3 - Circles & Translation Matrix

These shapes are all generated as "circles" with a different number of vertices.
The red circle (top) has 30 vertices.
The green hexagon is created as a circle with only 6 vertices.
The blue triangle is a "circle" with only 3 vertices.
Each object is translated by a fixed amount in the Y direction, and a varying amount in the X direction.
Since the Z coordinate is ignored, Z translations have no effect on the 2D canvas scene.