Options
Menu

Class Matrix

The Matrix export class represents a transformation matrix that determines how to map points from one coordinate space to another. You can perform various graphical transformations on a display object by setting the properties of a Matrix object, applying that Matrix object to the matrix property of a Transform object, and then applying that Transform object as the transform property of the display object. These transformation functions include translation(x and y repositioning), rotation, scaling, and skewing.

Together these types of transformations are known as affine transformations. Affine transformations preserve the straightness of lines while transforming, so that parallel lines stay parallel.

To apply a transformation matrix to a display object, you create a Transform object, set its matrix property to the transformation matrix, and then set the transform property of the display object to the Transform object. Matrix objects are also used as parameters of some methods, such as the following:

  • The draw() method of a BitmapData object
  • The beginBitmapFill() method, beginGradientFill() method, or lineGradientStyle() method of a Graphics object

A transformation matrix object is a 3 x 3 matrix with the following contents:

In traditional transformation matrixes, the u, v, and w properties provide extra capabilities. The Matrix export class can only operate in two-dimensional space, so it always assumes that the property values u and v are 0.0, and that the property value w is 1.0. The effective values of the matrix are as follows:

You can get and set the values of all six of the other properties in a Matrix object: a, b, c, d, tx, and ty.

The Matrix export class supports the four major types of transformations: translation, scaling, rotation, and skewing. You can set three of these transformations by using specialized methods, as described in the following table:

Each transformation function alters the current matrix properties so that you can effectively combine multiple transformations. To do this, you call more than one transformation function before applying the matrix to its display object target(by using the transform property of that display object).

Use the new Matrix() constructor to create a Matrix object before you can call the methods of the Matrix object.

Hierarchy

  • Matrix

Index

Constructors

constructor

  • new Matrix(rawData?: Float32Array): Matrix
  • new Matrix(a?: number, b?: number, c?: number, d?: number, tx?: number, ty?: number): Matrix
  • Creates a new Matrix object with the specified parameters. In matrix notation, the properties are organized like this:

    If you do not provide any parameters to the new Matrix() constructor, it creates an identity matrix with the following values:

    In matrix notation, the identity matrix looks like this:

    Parameters

    • Optional rawData: Float32Array

    Returns Matrix

  • Creates a new Matrix object with the specified parameters. In matrix notation, the properties are organized like this:

    If you do not provide any parameters to the new Matrix() constructor, it creates an identity matrix with the following values:

    In matrix notation, the identity matrix looks like this:

    Parameters

    • Optional a: number

      The value that affects the positioning of pixels along the x axis when scaling or rotating an image.

    • Optional b: number

      The value that affects the positioning of pixels along the y axis when rotating or skewing an image.

    • Optional c: number

      The value that affects the positioning of pixels along the x axis when rotating or skewing an image.

    • Optional d: number

      The value that affects the positioning of pixels along the y axis when scaling or rotating an image..

    • Optional tx: number

      The distance by which to translate each point along the x axis.

    • Optional ty: number

      The distance by which to translate each point along the y axis.

    Returns Matrix

Properties

rawData

rawData: Float32Array

Accessors

a

  • get (): number
  • set (value: number): void
  • The value that affects the positioning of pixels along the x axis when scaling or rotating an image.

    Returns number

  • The value that affects the positioning of pixels along the x axis when scaling or rotating an image.

    Parameters

    • value: number

    Returns void

b

  • get (): number
  • set (value: number): void
  • The value that affects the positioning of pixels along the y axis when rotating or skewing an image.

    Returns number

  • The value that affects the positioning of pixels along the y axis when rotating or skewing an image.

    Parameters

    • value: number

    Returns void

c

  • get (): number
  • set (value: number): void
  • The value that affects the positioning of pixels along the x axis when rotating or skewing an image.

    Returns number

  • The value that affects the positioning of pixels along the x axis when rotating or skewing an image.

    Parameters

    • value: number

    Returns void

d

  • get (): number
  • set (value: number): void
  • The value that affects the positioning of pixels along the y axis when scaling or rotating an image.

    Returns number

  • The value that affects the positioning of pixels along the y axis when scaling or rotating an image.

    Parameters

    • value: number

    Returns void

tx

  • get (): number
  • set (value: number): void
  • The distance by which to translate each point along the x axis.

    Returns number

  • The distance by which to translate each point along the x axis.

    Parameters

    • value: number

    Returns void

ty

  • get (): number
  • set (value: number): void
  • The distance by which to translate each point along the y axis.

    Returns number

  • The distance by which to translate each point along the y axis.

    Parameters

    • value: number

    Returns void

Methods

clone

  • Returns a new Matrix object that is a clone of this matrix, with an exact copy of the contained object.

    Returns Matrix

    A Matrix object.

concat

  • concat(matrix: Matrix): void
  • Concatenates a matrix with the current matrix, effectively combining the geometric effects of the two. In mathematical terms, concatenating two matrixes is the same as combining them using matrix multiplication.

    For example, if matrix m1 scales an object by a factor of four, and matrix m2 rotates an object by 1.5707963267949 radians(Math.PI/2), then m1.concat(m2) transforms m1 into a matrix that scales an object by a factor of four and rotates the object by Math.PI/2 radians.

    This method replaces the source matrix with the concatenated matrix. If you want to concatenate two matrixes without altering either of the two source matrixes, first copy the source matrix by using the clone() method, as shown in the Class Examples section.

    Parameters

    • matrix: Matrix

      The matrix to be concatenated to the source matrix.

    Returns void

copyColumnFrom

  • copyColumnFrom(column: number, vector3D: Vector3D): void
  • Copies a Vector3D object into specific column of the calling Matrix3D object.

    Parameters

    • column: number

      The column from which to copy the data from.

    • vector3D: Vector3D

      The Vector3D object from which to copy the data.

    Returns void

copyColumnTo

  • copyColumnTo(column: number, vector3D: Vector3D): void
  • Copies specific column of the calling Matrix object into the Vector3D object. The w element of the Vector3D object will not be changed.

    Parameters

    • column: number

      The column from which to copy the data from.

    • vector3D: Vector3D

      The Vector3D object from which to copy the data.

    Returns void

copyFrom

  • copyFrom(sourceMatrix: Matrix): void
  • Copies all of the matrix data from the source Point object into the calling Matrix object.

    Parameters

    • sourceMatrix: Matrix

      The Matrix object from which to copy the data.

    Returns void

copyRawDataFrom

  • copyRawDataFrom(vector: Float32Array, index?: number): void
  • Parameters

    • vector: Float32Array
    • Default value index: number = 0

    Returns void

copyRowFrom

  • copyRowFrom(row: number, vector3D: Vector3D): void
  • Copies a Vector3D object into specific row of the calling Matrix object.

    Parameters

    • row: number

      The row from which to copy the data from.

    • vector3D: Vector3D

      The Vector3D object from which to copy the data.

    Returns void

copyRowTo

  • copyRowTo(row: number, vector3D: Vector3D): void
  • Copies specific row of the calling Matrix object into the Vector3D object. The w element of the Vector3D object will not be changed.

    Parameters

    • row: number

      The row from which to copy the data from.

    • vector3D: Vector3D

      The Vector3D object from which to copy the data.

    Returns void

createBox

  • createBox(scaleX: number, scaleY: number, rotation?: number, tx?: number, ty?: number): void
  • Includes parameters for scaling, rotation, and translation. When applied to a matrix it sets the matrix's values based on those parameters.

    Using the createBox() method lets you obtain the same matrix as you would if you applied the identity(), rotate(), scale(), and translate() methods in succession. For example, mat1.createBox(2,2,Math.PI/4, 100, 100) has the same effect as the following:

    Parameters

    • scaleX: number

      The factor by which to scale horizontally.

    • scaleY: number

      The factor by which scale vertically.

    • Default value rotation: number = 0

      The amount to rotate, in radians.

    • Default value tx: number = 0

      The number of pixels to translate(move) to the right along the x axis.

    • Default value ty: number = 0

      The number of pixels to translate(move) down along the y axis.

    Returns void

createGradientBox

  • createGradientBox(width: number, height: number, rotation?: number, tx?: number, ty?: number): void
  • Creates the specific style of matrix expected by the beginGradientFill() and lineGradientStyle() methods of the Graphics class. Width and height are scaled to a scaleX/scaleY pair and the tx/ty values are offset by half the width and height.

    For example, consider a gradient with the following characteristics:

    • GradientType.LINEAR
    • Two colors, green and blue, with the ratios array set to [0, 255]
    • SpreadMethod.PAD
    • InterpolationMethod.LINEAR_RGB

    The following illustrations show gradients in which the matrix was defined using the createGradientBox() method with different parameter settings:

    Parameters

    • width: number

      The width of the gradient box.

    • height: number

      The height of the gradient box.

    • Default value rotation: number = 0

      The amount to rotate, in radians.

    • Default value tx: number = 0

      The distance, in pixels, to translate to the right along the x axis. This value is offset by half of the width parameter.

    • Default value ty: number = 0

      The distance, in pixels, to translate down along the y axis. This value is offset by half of the height parameter.

    Returns void

deltaTransformPoint

  • Given a point in the pretransform coordinate space, returns the coordinates of that point after the transformation occurs. Unlike the standard transformation applied using the transformPoint() method, the deltaTransformPoint() method's transformation does not consider the translation parameters tx and ty.

    Parameters

    • point: Point

      The point for which you want to get the result of the matrix transformation.

    Returns Point

    The point resulting from applying the matrix transformation.

identity

  • identity(): void
  • Sets each matrix property to a value that causes a null transformation. An object transformed by applying an identity matrix will be identical to the original.

    After calling the identity() method, the resulting matrix has the following properties: a=1, b=0, c=0, d=1, tx=0, ty=0.

    In matrix notation, the identity matrix looks like this:

    Returns void

invert

  • invert(): void
  • Performs the opposite transformation of the original matrix. You can apply an inverted matrix to an object to undo the transformation performed when applying the original matrix.

    Returns void

multiply

  • Returns a new Matrix object that is a clone of this matrix, with an exact copy of the contained object.

    Parameters

    • matrix: Matrix

      The matrix for which you want to get the result of the matrix transformation.

    Returns Matrix

    A Matrix object.

rotate

  • rotate(angle: number): void
  • Applies a rotation transformation to the Matrix object.

    The rotate() method alters the a, b, c, and d properties of the Matrix object. In matrix notation, this is the same as concatenating the current matrix with the following:

    Parameters

    • angle: number

      The rotation angle in radians.

    Returns void

scale

  • scale(sx: number, sy: number): void
  • Applies a scaling transformation to the matrix. The x axis is multiplied by sx, and the y axis it is multiplied by sy.

    The scale() method alters the a and d properties of the Matrix object. In matrix notation, this is the same as concatenating the current matrix with the following matrix:

    Parameters

    • sx: number

      A multiplier used to scale the object along the x axis.

    • sy: number

      A multiplier used to scale the object along the y axis.

    Returns void

setTo

  • setTo(a: number, b: number, c: number, d: number, tx: number, ty: number): void
  • Sets the members of Matrix to the specified values.

    Parameters

    • a: number

      The value that affects the positioning of pixels along the x axis when scaling or rotating an image.

    • b: number

      The value that affects the positioning of pixels along the y axis when rotating or skewing an image.

    • c: number

      The value that affects the positioning of pixels along the x axis when rotating or skewing an image.

    • d: number

      The value that affects the positioning of pixels along the y axis when scaling or rotating an image..

    • tx: number

      The distance by which to translate each point along the x axis.

    • ty: number

      The distance by which to translate each point along the y axis.

    Returns void

toString

  • toString(): string
  • Returns a text value listing the properties of the Matrix object.

    Returns string

    A string containing the values of the properties of the Matrix object: a, b, c, d, tx, and ty.

transformPoint

  • Returns the result of applying the geometric transformation represented by the Matrix object to the specified point.

    Parameters

    • point: Point

      The point for which you want to get the result of the Matrix transformation.

    Returns Point

    The point resulting from applying the Matrix transformation.

translate

  • translate(dx: number, dy: number): void
  • Translates the matrix along the x and y axes, as specified by the dx and dy parameters.

    Parameters

    • dx: number

      The amount of movement along the x axis to the right, in pixels.

    • dy: number

      The amount of movement down along the y axis, in pixels.

    Returns void

Generated using TypeDoc