Class: Matrix2D

A specialized 2x3 Matrix representing a 2D transformation.

A Matrix2D contains six elements defined as [a, b, c, d, tx, ty]

This is a shortcut for a 3x3 matrix of the form [a, b, 0, c, d, 0 tx, ty, 1]

Note that because a Matrix2D ignores the z-values of each component vectors, it does not satisfy all properties of a “real” 3x3 matrix.

A Matrix2D has no transpose
A(B + C) = AB + AC does not hold for a Matrix2D
(rA)^-1 = r^-1 A^-1, r != 0 does not hold for a Matrix2D
r(AB) = (rA)B = A(rB) does not hold for a Matrix2D

Implements

Constructors

Constructor

new Matrix2D(): Matrix2D

Defined in: types/Matrix2D.ts:216

Returns

Matrix2D

Constructor

new Matrix2D(matrix): Matrix2D

Defined in: types/Matrix2D.ts:217

Parameters

matrix

PossibleMatrix2D

Returns

Matrix2D

Constructor

new Matrix2D(x, y, z): Matrix2D

Defined in: types/Matrix2D.ts:218

Parameters

Returns

Matrix2D

Constructor

new Matrix2D(a, b, c, d, tx, ty): Matrix2D

Defined in: types/Matrix2D.ts:223

Parameters

a

number

b

number

c

number

d

number

tx

number

ty

number

Returns

Matrix2D

Properties

values

readonly values: Float32Array

Defined in: types/Matrix2D.ts:38

identity

readonly static identity: Matrix2D

Defined in: types/Matrix2D.ts:39

symbol

readonly static symbol: typeof symbol

Defined in: types/Matrix2D.ts:36

zero

readonly static zero: Matrix2D

Defined in: types/Matrix2D.ts:40

Accessors

determinant

Get Signature

get determinant(): number

Defined in: types/Matrix2D.ts:201

Get the determinant of the matrix.

Returns

number

domMatrix

Get Signature

get domMatrix(): DOMMatrix

Defined in: types/Matrix2D.ts:205

Returns

DOMMatrix

inverse

Get Signature

get inverse(): Matrix2D | null

Defined in: types/Matrix2D.ts:172

Get the inverse of the matrix.

Remarks

If the matrix is not invertible, i.e. its determinant is 0, this will return null, instead.

Example


const matrix = new Matrix2D(
  [1, 2],
  [3, 4],
  [5, 6],
);
 
const inverse = matrix.inverse;
// => Matrix2D(
//      [-2, 1],
//      [1.5, -0.5],
//      [1, -2],
//   )

Returns

Matrix2D | null

rotation

Get Signature

get rotation(): number

Defined in: types/Matrix2D.ts:110

Returns

number

Set Signature

set rotation(angle): void

Defined in: types/Matrix2D.ts:114

Parameters

angle

number

Returns

void

scaleX

Get Signature

get scaleX(): number

Defined in: types/Matrix2D.ts:62

Returns

number

Set Signature

set scaleX(value): void

Defined in: types/Matrix2D.ts:66

Parameters

value

number

Returns

void

scaleY

Get Signature

get scaleY(): number

Defined in: types/Matrix2D.ts:78

Returns

number

Set Signature

set scaleY(value): void

Defined in: types/Matrix2D.ts:82

Parameters

value

number

Returns

void

scaling

Get Signature

get scaling(): Vector2

Defined in: types/Matrix2D.ts:133

Returns

Vector2

Set Signature

set scaling(value): void

Defined in: types/Matrix2D.ts:137

Parameters

value

PossibleVector2

Returns

void

skewX

Get Signature

get skewX(): number

Defined in: types/Matrix2D.ts:70

Returns

number

Set Signature

set skewX(value): void

Defined in: types/Matrix2D.ts:74

Parameters

value

number

Returns

void

skewY

Get Signature

get skewY(): number

Defined in: types/Matrix2D.ts:86

Returns

number

Set Signature

set skewY(value): void

Defined in: types/Matrix2D.ts:90

Parameters

value

number

Returns

void

translateX

Get Signature

get translateX(): number

Defined in: types/Matrix2D.ts:94

Returns

number

Set Signature

set translateX(value): void

Defined in: types/Matrix2D.ts:98

Parameters

value

number

Returns

void

translateY

Get Signature

get translateY(): number

Defined in: types/Matrix2D.ts:102

Returns

number

Set Signature

set translateY(value): void

Defined in: types/Matrix2D.ts:106

Parameters

value

number

Returns

void

translation

Get Signature

get translation(): Vector2

Defined in: types/Matrix2D.ts:123

Returns

Vector2

Set Signature

set translation(translation): void

Defined in: types/Matrix2D.ts:127

Parameters

translation

PossibleVector2

Returns

void

x

Get Signature

get x(): Vector2

Defined in: types/Matrix2D.ts:54

Returns

Vector2

y

Get Signature

get y(): Vector2

Defined in: types/Matrix2D.ts:58

Returns

Vector2

Methods

add()

add(other): Matrix2D

Defined in: types/Matrix2D.ts:638

Add the provided matrix to this matrix.

Parameters

other

Matrix2D

The matrix to add

Returns

Matrix2D

Remarks

This method returns a new matrix representing the result of the computation. It will not modify the source matrix.

Example


const a = new Matrix2D(
  [1, 2],
  [3, 4],
  [5, 6],
);
const a = new Matrix2D(
  [7, 8],
  [9, 10],
  [11, 12],
);
 
const result = a.add(b);
// => Matrix2D(
//      [8, 10],
//      [12, 14],
//      [16, 18],
//    )

column()

column(index): Vector2

Defined in: types/Matrix2D.ts:336

Get the nth component vector of the matrix. Only defined for 0, 1, and 2.

Parameters

index

number

The index of the component vector to retrieve.

Returns

Vector2

Example


const matrix = new Matrix2D(
  [1, 0],
  [0, 0],
  [1, 0],
);
 
const x = matrix.column(0);
// Vector2(1, 0)
 
const y = matrix.column(1);
// Vector2(0, 0)
 
const z = matrix.column(1);
// Vector2(1, 0)

equals()

equals(other, threshold?): boolean

Defined in: types/Matrix2D.ts:701

Parameters

other

Matrix2D

threshold?

number = EPSILON

Returns

boolean

exactlyEquals()

exactlyEquals(other): boolean

Defined in: types/Matrix2D.ts:717

Parameters

other

Matrix2D

Returns

boolean

mul()

mul(other): Matrix2D

Defined in: types/Matrix2D.ts:394

Returns the matrix product of this matrix with the provided matrix.

Parameters

other

Matrix2D

The matrix to multiply with

Returns

Matrix2D

Remarks

This method returns a new matrix representing the result of the computation. It will not modify the source matrix.

Example


const a = new Matrix2D(
  [1, 2],
  [0, 1],
  [1, 1],
);
const b = new Matrix2D(
  [2, 1],
  [1, 1],
  [1, 1],
);
 
const result = a.mul(b);
// => Matrix2D(
//     [2, 5],
//     [1, 3],
//     [2, 4],
//   )

mulScalar()

mulScalar(s): Matrix2D

Defined in: types/Matrix2D.ts:549

Multiply each value of the matrix by a scalar.

Parameters

s

number

The value by which to scale each term

Returns

Matrix2D

Example


const matrix = new Matrix2D(
  [1, 2],
  [3, 4],
  [5, 6],
);
 
const result1 = matrix.mulScalar(2);
// => new Matrix2D(
//      [2, 4],
//      [6, 8],
//      [10, 12],
//    )

rotate()

rotate(angle, degrees?): Matrix2D

Defined in: types/Matrix2D.ts:453

Rotate the matrix by the provided angle. By default, the angle is provided in degrees.

Parameters

angle

number

The angle by which to rotate the matrix.

degrees?

boolean = true

Whether the angle is provided in degrees.

Returns

Matrix2D

Remarks

This method returns a new matrix representing the result of the computation. It will not modify the source matrix.

Example


const a = new Matrix2D(
  [1, 2],
  [3, 4],
  [5, 6],
);
 
const result = a.rotate(90);
// => Matrix2D(
//     [3, 4],
//     [-1, -2],
//     [5, 6],
//   )
 
// Provide the angle in radians
const result = a.rotate(Math.PI * 0.5, true);
// => Matrix2D(
//     [3, 4],
//     [-1, -2],
//     [5, 6],
//   )

row()

row(index): [number, number, number]

Defined in: types/Matrix2D.ts:360

Returns the nth row of the matrix. Only defined for 0 and 1.

Parameters

index

number

The index of the row to retrieve.

Returns

[number, number, number]

Example


const matrix = new Matrix2D(
  [1, 0],
  [0, 0],
  [1, 0],
);
 
const firstRow = matrix.column(0);
// [1, 0, 1]
 
const secondRow = matrix.column(1);
// [0, 0, 0]

scale()

scale(vec): Matrix2D

Defined in: types/Matrix2D.ts:515

Scale the x and y component vectors of the matrix.

Parameters

vec

PossibleVector2

The factor by which to scale the matrix

Returns

Matrix2D

Remarks

If vec is provided as a vector, the x and y component vectors of the matrix will be scaled by the x and y parts of the vector, respectively.

If vec is provided as a scalar, the x and y component vectors will be scaled uniformly by this factor.

This method returns a new matrix representing the result of the computation. It will not modify the source matrix.

Example


const matrix = new Matrix2D(
  [1, 2],
  [3, 4],
  [5, 6],
);
 
const result1 = matrix.scale([2, 3]);
// => new Matrix2D(
//      [2, 4],
//      [9, 12],
//      [5, 6],
//    )
 
const result2 = matrix.scale(2);
// => new Matrix2D(
//      [2, 4],
//      [6, 8],
//      [5, 6],
//    )

sub()

sub(other): Matrix2D

Defined in: types/Matrix2D.ts:679

Subtract the provided matrix from this matrix.

Parameters

other

Matrix2D

The matrix to subract

Returns

Matrix2D

Remarks

This method returns a new matrix representing the result of the computation. It will not modify the source matrix.

Example


const a = new Matrix2D(
  [1, 2],
  [3, 4],
  [5, 6],
);
const a = new Matrix2D(
  [7, 8],
  [9, 10],
  [11, 12],
);
 
const result = a.sub(b);
// => Matrix2D(
//      [-6, -6],
//      [-6, -6],
//      [-6, -6],
//    )

toSymbol()

toSymbol(): symbol

Defined in: types/Matrix2D.ts:690

Returns

symbol

Implementation of

Type.toSymbol

toUniform()

toUniform(gl, location): void

Defined in: types/Matrix2D.ts:694

Parameters

gl

WebGL2RenderingContext

location

WebGLUniformLocation

Returns

void

Implementation of

WebGLConvertible.toUniform

translate()

translate(vec): Matrix2D

Defined in: types/Matrix2D.ts:595

Translate the matrix by the dimensions of the provided vector.

Parameters

vec

PossibleVector2

The vector by which to translate the matrix

Returns

Matrix2D

Remarks

If vec is provided as a scalar, matrix will be translated uniformly by this factor.

This method returns a new matrix representing the result of the computation. It will not modify the source matrix.

Example


const matrix = new Matrix2D(
  [1, 2],
  [3, 4],
  [5, 6],
);
 
const result1 = matrix.translate([2, 3]);
// => new Matrix2D(
//      [1, 2],
//      [3, 4],
//      [16, 22],
//    )
 
const result2 = matrix.translate(2);
// => new Matrix2D(
//      [1, 2],
//      [3, 4],
//      [13, 18],
//    )