Class: TransformMatrix

Phaser.GameObjects.Components. TransformMatrix

A Matrix used for display transformations for rendering.

It is represented like so:

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

new TransformMatrix( [a] [, b] [, c] [, d] [, tx] [, ty])

Parameters:
Name Type Argument Default Description
a number <optional>
1

The Scale X value.

b number <optional>
0

The Shear Y value.

c number <optional>
0

The Shear X value.

d number <optional>
1

The Scale Y value.

tx number <optional>
0

The Translate X value.

ty number <optional>
0

The Translate Y value.

Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 10)

Members


a :number

The Scale X value.

Type:
  • number
Since: 3.4.0
Source: src/gameobjects/components/TransformMatrix.js (Line 72)

b :number

The Shear Y value.

Type:
  • number
Since: 3.4.0
Source: src/gameobjects/components/TransformMatrix.js (Line 93)

c :number

The Shear X value.

Type:
  • number
Since: 3.4.0
Source: src/gameobjects/components/TransformMatrix.js (Line 114)

d :number

The Scale Y value.

Type:
  • number
Since: 3.4.0
Source: src/gameobjects/components/TransformMatrix.js (Line 135)

decomposedMatrix :object

The decomposed matrix.

Type:
  • object
Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 56)

e :number

The Translate X value.

Type:
  • number
Since: 3.11.0
Source: src/gameobjects/components/TransformMatrix.js (Line 156)

f :number

The Translate Y value.

Type:
  • number
Since: 3.11.0
Source: src/gameobjects/components/TransformMatrix.js (Line 177)

matrix :Float32Array

The matrix values.

Type:
  • Float32Array
Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 47)

<readonly> rotation :number

The rotation of the Matrix.

Type:
  • number
Since: 3.4.0
Source: src/gameobjects/components/TransformMatrix.js (Line 240)

<readonly> scaleX :number

The horizontal scale of the Matrix.

Type:
  • number
Since: 3.4.0
Source: src/gameobjects/components/TransformMatrix.js (Line 257)

<readonly> scaleY :number

The vertical scale of the Matrix.

Type:
  • number
Since: 3.4.0
Source: src/gameobjects/components/TransformMatrix.js (Line 274)

tx :number

The Translate X value.

Type:
  • number
Since: 3.4.0
Source: src/gameobjects/components/TransformMatrix.js (Line 198)

ty :number

The Translate Y value.

Type:
  • number
Since: 3.4.0
Source: src/gameobjects/components/TransformMatrix.js (Line 219)

Methods


applyInverse(x, y [, output])

Takes the x and y values and returns a new position in the output vector that is the inverse of the current matrix with its transformation applied.

Can be used to translate points from world to local space.

Parameters:
Name Type Argument Description
x number

The x position to translate.

y number

The y position to translate.

output Phaser.Math.Vector2 <optional>

A Vector2, or point-like object, to store the results in.

Since: 3.12.0
Source: src/gameobjects/components/TransformMatrix.js (Line 822)
Returns:

The coordinates, inverse-transformed through this matrix.

Type
Phaser.Math.Vector2

applyITRS(x, y, rotation, scaleX, scaleY)

Apply the identity, translate, rotate and scale operations on the Matrix.

Parameters:
Name Type Description
x number

The horizontal translation.

y number

The vertical translation.

rotation number

The angle of rotation in radians.

scaleX number

The horizontal scale.

scaleY number

The vertical scale.

Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 788)
Returns:

This TransformMatrix.

Type
Phaser.GameObjects.Components.TransformMatrix

copyFrom(src)

Set the values of this Matrix to copy those of the matrix given.

Parameters:
Name Type Description
src Phaser.GameObjects.Components.TransformMatrix

The source Matrix to copy from.

Since: 3.11.0
Source: src/gameobjects/components/TransformMatrix.js (Line 578)
Returns:

This TransformMatrix.

Type
Phaser.GameObjects.Components.TransformMatrix

copyFromArray(src)

Set the values of this Matrix to copy those of the array given. Where array indexes 0, 1, 2, 3, 4 and 5 are mapped to a, b, c, d, e and f.

Parameters:
Name Type Description
src array

The array of values to set into this matrix.

Since: 3.11.0
Source: src/gameobjects/components/TransformMatrix.js (Line 602)
Returns:

This TransformMatrix.

Type
Phaser.GameObjects.Components.TransformMatrix

copyToArray( [out])

Copy the values in this Matrix to the array given.

Where array indexes 0, 1, 2, 3, 4 and 5 are mapped to a, b, c, d, e and f.

Parameters:
Name Type Argument Description
out array <optional>

The array to copy the matrix values in to.

Since: 3.12.0
Source: src/gameobjects/components/TransformMatrix.js (Line 667)
Returns:

An array where elements 0 to 5 contain the values from this matrix.

Type
array

copyToContext(ctx)

Copy the values from this Matrix to the given Canvas Rendering Context. This will use the Context.transform method.

Parameters:
Name Type Description
ctx CanvasRenderingContext2D

The Canvas Rendering Context to copy the matrix values to.

Since: 3.12.0
Source: src/gameobjects/components/TransformMatrix.js (Line 627)
Returns:

The Canvas Rendering Context.

Type
CanvasRenderingContext2D

decomposeMatrix()

Decompose this Matrix into its translation, scale and rotation values using QR decomposition.

The result must be applied in the following order to reproduce the current matrix:

translate -> rotate -> scale

Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 729)
Returns:

The decomposed Matrix.

Type
object

destroy()

Destroys this Transform Matrix.

Since: 3.4.0
Source: src/gameobjects/components/TransformMatrix.js (Line 907)

getCSSMatrix()

Returns a string that can be used in a CSS Transform call as a matrix property.

Since: 3.12.0
Source: src/gameobjects/components/TransformMatrix.js (Line 892)
Returns:

A string containing the CSS Transform matrix values.

Type
string

getX(x, y)

Returns the X component of this matrix multiplied by the given values. This is the same as x * a + y * c + e.

Parameters:
Name Type Description
x number

The x value.

y number

The y value.

Since: 3.12.0
Source: src/gameobjects/components/TransformMatrix.js (Line 858)
Returns:

The calculated x value.

Type
number

getY(x, y)

Returns the Y component of this matrix multiplied by the given values. This is the same as x * b + y * d + f.

Parameters:
Name Type Description
x number

The x value.

y number

The y value.

Since: 3.12.0
Source: src/gameobjects/components/TransformMatrix.js (Line 875)
Returns:

The calculated y value.

Type
number

invert()

Invert the Matrix.

Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 547)
Returns:

This TransformMatrix.

Type
Phaser.GameObjects.Components.TransformMatrix

loadIdentity()

Reset the Matrix to an identity matrix.

Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 291)
Returns:

This TransformMatrix.

Type
Phaser.GameObjects.Components.TransformMatrix

multiply(rhs [, out])

Multiply this Matrix by the given Matrix.

If an out Matrix is given then the results will be stored in it. If it is not given, this matrix will be updated in place instead. Use an out Matrix if you do not wish to mutate this matrix.

Parameters:
Name Type Argument Description
rhs Phaser.GameObjects.Components.TransformMatrix

The Matrix to multiply by.

out Phaser.GameObjects.Components.TransformMatrix <optional>

An optional Matrix to store the results in.

Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 387)
Returns:

Either this TransformMatrix, or the out Matrix, if given in the arguments.

Type
Phaser.GameObjects.Components.TransformMatrix

multiplyWithOffset(src, offsetX, offsetY)

Multiply this Matrix by the matrix given, including the offset.

The offsetX is added to the tx value: offsetX * a + offsetY * c + tx. The offsetY is added to the ty value: offsetY * b + offsetY * d + ty.

Parameters:
Name Type Description
src Phaser.GameObjects.Components.TransformMatrix

The source Matrix to copy from.

offsetX number

Horizontal offset to factor in to the multiplication.

offsetY number

Vertical offset to factor in to the multiplication.

Since: 3.11.0
Source: src/gameobjects/components/TransformMatrix.js (Line 433)
Returns:

This TransformMatrix.

Type
Phaser.GameObjects.Components.TransformMatrix

rotate(angle)

Rotate the Matrix.

Parameters:
Name Type Description
angle number

The angle of rotation in radians.

Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 357)
Returns:

This TransformMatrix.

Type
Phaser.GameObjects.Components.TransformMatrix

scale(x, y)

Scale the Matrix.

Parameters:
Name Type Description
x number

The horizontal scale value.

y number

The vertical scale value.

Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 334)
Returns:

This TransformMatrix.

Type
Phaser.GameObjects.Components.TransformMatrix

setToContext(ctx)

Copy the values from this Matrix to the given Canvas Rendering Context. This will use the Context.setTransform method.

Parameters:
Name Type Description
ctx CanvasRenderingContext2D

The Canvas Rendering Context to copy the matrix values to.

Since: 3.12.0
Source: src/gameobjects/components/TransformMatrix.js (Line 647)
Returns:

The Canvas Rendering Context.

Type
CanvasRenderingContext2D

setTransform(a, b, c, d, tx, ty)

Set the values of this Matrix.

Parameters:
Name Type Description
a number

The Scale X value.

b number

The Shear Y value.

c number

The Shear X value.

d number

The Scale Y value.

tx number

The Translate X value.

ty number

The Translate Y value.

Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 700)
Returns:

This TransformMatrix.

Type
Phaser.GameObjects.Components.TransformMatrix

transform(a, b, c, d, tx, ty)

Transform the Matrix.

Parameters:
Name Type Description
a number

The Scale X value.

b number

The Shear Y value.

c number

The Shear X value.

d number

The Scale Y value.

tx number

The Translate X value.

ty number

The Translate Y value.

Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 480)
Returns:

This TransformMatrix.

Type
Phaser.GameObjects.Components.TransformMatrix

transformPoint(x, y, point)

Transform a point using this Matrix.

Parameters:
Name Type Description
x number

The x coordinate of the point to transform.

y number

The y coordinate of the point to transform.

point Phaser.Geom.Point | Phaser.Math.Vector2 | object

The Point object to store the transformed coordinates.

Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 516)
Returns:

The Point containing the transformed coordinates.

Type
Phaser.Geom.Point | Phaser.Math.Vector2 | object

translate(x, y)

Translate the Matrix.

Parameters:
Name Type Description
x number

The horizontal translation value.

y number

The vertical translation value.

Since: 3.0.0
Source: src/gameobjects/components/TransformMatrix.js (Line 313)
Returns:

This TransformMatrix.

Type
Phaser.GameObjects.Components.TransformMatrix