# Class: Matrix

## Matrix(values)

#### new Matrix(values)

2D 3x2 transformation matrix, used to represent linear geometric transformations over objects. The values of the matrix are stored as numeric array. The matrix can be applied to the canvas or DOM elements using CSS transforms.

##### Parameters:

Name | Type | Description
--- | --- | ---
`values` | Array.<number> | Array of matrix values by row, needs to have exactly 6 values. Default is the identity matrix.

Source:
  - math/Matrix.js, line 11

### Members

#### m :Array.<number>

Array that contains the matrix data by row. This matrix should have 6 values. Matrix can be directly edited by accessing this attribute.

##### Type:

- Array.<number>

Source:
  - math/Matrix.js, line 22

### Methods

#### clone() → {Matrix}

Create a new matrix object with a copy of the content of this one.

Source:
  - math/Matrix.js, line 45

##### Returns:

Copy of this matrix.

Type
  Matrix

#### compose(px, py, sx, sy, ox, oy, rot)

Compose this transformation matrix with position scale and rotation and origin point.

##### Parameters:

Name | Type | Description
--- | --- | ---
`px` | number | Position X
`py` | number | Position Y
`sx` | number | Scale X
`sy` | number | Scale Y
`ox` | number | Origin X (applied before scale and rotation)
`oy` | number | Origin Y (applied before scale and rotation)
`rot` | number | Rotation angle (radians).

Source:
  - math/Matrix.js, line 103

#### copy(mat)

Copy the content of another matrix and store in this one.

##### Parameters:

Name | Type | Description
--- | --- | ---
`mat` | Matrix | Matrix to copy values from.

Source:
  - math/Matrix.js, line 35

#### cssTransform() → {string}

Generate a CSS transform string that can be applied to the transform style of any DOM element.

Source:
  - math/Matrix.js, line 282

##### Returns:

CSS transform matrix.

Type
  string

#### determinant() → {number}

Get the matrix determinant.

Source:
  - math/Matrix.js, line 226

##### Returns:

Determinant of this matrix.

Type
  number

#### getInverse() → {Matrix}

Get the inverse matrix.

Source:
  - math/Matrix.js, line 236

##### Returns:

New matrix instance containing the inverse matrix.

Type
  Matrix

#### getPosition() → {Vector2}

Extract the position from the transformation matrix.

Source:
  - math/Matrix.js, line 205

##### Returns:

Position of the matrix transformation.

Type
  Vector2

#### getScale() → {Vector2}

Extract the scale from the transformation matrix.

Source:
  - math/Matrix.js, line 195

##### Returns:

Scale of the matrix transformation.

Type
  Vector2

#### identity()

Reset this matrix to identity.

Source:
  - math/Matrix.js, line 53

#### multiply(mat)

Multiply another matrix by this one and store the result.

##### Parameters:

Name | Type | Description
--- | --- | ---
`mat` | Matrix | Matrix to multiply by.

Source:
  - math/Matrix.js, line 63

#### premultiply(mat)

Premultiply another matrix by this one and store the result.

##### Parameters:

Name | Type | Description
--- | --- | ---
`mat` | Matrix | Matrix to premultiply by.

Source:
  - math/Matrix.js, line 80

#### rotate(rad)

Apply rotation to this matrix.

##### Parameters:

Name | Type | Description
--- | --- | ---
`rad` | number | Angle to rotate the matrix in radians.

Source:
  - math/Matrix.js, line 148

#### scale(sx, sy)

Apply scale to this matrix.

##### Parameters:

Name | Type | Description
--- | --- | ---
`sx` | number |
`sy` | number |

Source:
  - math/Matrix.js, line 170

#### setContextTransform(context)

Set a canvas context to use this transformation.

##### Parameters:

Name | Type | Description
--- | --- | ---
`context` | CanvasRenderingContext2D | Canvas context to apply this matrix transform.

Source:
  - math/Matrix.js, line 262

#### setPosition(x, y)

Set the position of the transformation matrix.

##### Parameters:

Name | Type | Description
--- | --- | ---
`x` | number |
`y` | number |

Source:
  - math/Matrix.js, line 184

#### skew(radianX, radianY)

Apply skew to this matrix.

##### Parameters:

Name | Type | Description
--- | --- | ---
`radianX` | number |
`radianY` | number |

Source:
  - math/Matrix.js, line 216

#### tranformContext(context)

Transform on top of the current context transformation.

##### Parameters:

Name | Type | Description
--- | --- | ---
`context` | CanvasRenderingContext2D | Canvas context to apply this matrix transform.

Source:
  - math/Matrix.js, line 272

#### transformPoint(p) → {Vector2}

Transform a point using this matrix.

##### Parameters:

Name | Type | Description
--- | --- | ---
`p` | Vector2 | Point to be transformed.

Source:
  - math/Matrix.js, line 249

##### Returns:

Transformed point.

Type
  Vector2

#### translate(x, y)

Apply translation to this matrix. Adds position over the transformation already stored in the matrix.

##### Parameters:

Name | Type | Description
--- | --- | ---
`x` | number |
`y` | number |

Source:
  - math/Matrix.js, line 137