Transform

Transform holds matrix data to make 2d rotate, translate, scale and skew transformations. Angles are in degrees.

This class represents a 2D affine transformation matrix used for positioning, rotating, scaling, and skewing visual objects. The matrix is stored in the following format:

| a | c | tx |
| b | d | ty |
| 0 | 0 | 1  |

Where:

• a and d control scaling and rotation
• b and c control skewing and rotation
• tx and ty control translation (position)

Example usage:

var transform = new Transform();
transform.translate(100, 50);    // Move to (100, 50)
transform.rotate(Math.PI / 4);   // Rotate 45 degrees
transform.scale(2, 2);           // Double the size

// Apply to a point
var newX = transform.transformX(10, 20);
var newY = transform.transformY(10, 20);

The Transform class includes change tracking to optimize rendering pipelines and supports decomposition into individual components (position, scale, rotation, skew).

Instance Members #

The (0,0) element of the matrix, affects horizontal scaling and rotation.

The (1,0) element of the matrix, affects vertical skewing and rotation.

The (0,1) element of the matrix, affects horizontal skewing and rotation.

The (1,1) element of the matrix, affects vertical scaling and rotation.

The horizontal translation (x position) in pixels.

The vertical translation (y position) in pixels.

Whether the transform has changed since the last change event. Call computeChanged() to update this value.

Emitted when any transform property changes. Useful for invalidating caches or triggering re-renders.

Check if the transform has changed by comparing current values to previous values. Updates the changed property. Call this before checking changed to ensure the value is up to date.

Reset the change tracking state. After calling this, changed will be false until the transform is modified again.

Create a copy of this transform.

Concatenate (multiply) this transform with another transform. The result is stored in this transform. This is equivalent to: this = this * m

Decompose the transform matrix into its component parts. Extracts position, scale, rotation, and skew from the matrix.

Set this transform from decomposed values. Rebuilds the matrix from position, scale, rotation, and skew components.

Set this transform from individual component values. Rebuilds the matrix from position, scale, rotation, skew, and pivot.

Set this transform by interpolating between two other transforms. Useful for animations and transitions.

Transform a vector's X component without translation. Useful for transforming directions or deltas.

Transform a vector's Y component without translation. Useful for transforming directions or deltas.

Check if this transform equals another transform. Compares all matrix elements for exact equality.

Reset this transform to the identity matrix. The identity matrix has no translation, rotation, scale, or skew. Equivalent to: a=1, b=0, c=0, d=1, tx=0, ty=0

Invert this transform matrix. The inverted matrix can be used to reverse transformations. If the matrix is not invertible (determinant = 0), sets to a degenerate state.

Rotate the transform by the specified angle. The rotation is applied relative to the current transform.

Scale the transform by the specified factors. The scaling is applied relative to the current transform.

Translate (move) the transform by the specified offset. The translation is applied relative to the current transform.

Apply skew transformation. Skewing shears the coordinate space along the X and Y axes.

Set the rotation and uniform scale directly. This replaces the current rotation and scale, discarding any skew.

Set all matrix values directly.

Copy all values from another transform.

Get a string representation of the transform. Includes both matrix values and decomposed components.

Transform a point's X coordinate. Applies the full transformation including translation.

Transform a point's Y coordinate. Applies the full transformation including translation.

Create a new Transform matrix.

Private Members #

Metadata #