Class: Path

Phaser.Curves. Path

A Path combines multiple Curves into one continuous compound curve. It does not matter how many Curves are in the Path or what type they are.

A Curve in a Path does not have to start where the previous Curve ends - that is to say, a Path does not have to be an uninterrupted curve. Only the order of the Curves influences the actual points on the Path.


new Path( [x] [, y])

Parameters:
Name Type Argument Default Description
x number <optional>
0

The X coordinate of the Path's starting point or a Phaser.Types.Curves.JSONPath.

y number <optional>
0

The Y coordinate of the Path's starting point.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 20)

Members


autoClose :boolean

Automatically closes the path.

Type:
  • boolean
Since: 3.0.0
Default Value:
  • false
Source: src/curves/path/Path.js (Line 78)

cacheLengths :Array.<number>

The cached length of each Curve in the Path.

Used internally by #getCurveLengths.

Type:
  • Array.<number>
Since: 3.0.0
Default Value:
  • []
Source: src/curves/path/Path.js (Line 66)

curves :Array.<Phaser.Curves.Curve>

The list of Curves which make up this Path.

Type:
Since: 3.0.0
Default Value:
  • []
Source: src/curves/path/Path.js (Line 56)

name :string

The name of this Path. Empty by default and never populated by Phaser, this is left for developers to use.

Type:
  • string
Since: 3.0.0
Default Value:
  • ''
Source: src/curves/path/Path.js (Line 45)

startPoint :Phaser.Math.Vector2

The starting point of the Path.

This is not necessarily equivalent to the starting point of the first Curve in the Path. In an empty Path, it's also treated as the ending point.

Type:
Since: 3.0.0
Source: src/curves/path/Path.js (Line 88)

Methods


add(curve)

Appends a Curve to the end of the Path.

The Curve does not have to start where the Path ends or, for an empty Path, at its defined starting point.

Parameters:
Name Type Description
curve Phaser.Curves.Curve

The Curve to append.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 129)
Returns:

This Path object.

Type
Phaser.Curves.Path

circleTo(radius [, clockwise] [, rotation])

Creates a circular Ellipse Curve positioned at the end of the Path.

Parameters:
Name Type Argument Default Description
radius number

The radius of the circle.

clockwise boolean <optional>
false

true to create a clockwise circle as opposed to a counter-clockwise circle.

rotation number <optional>
0

The rotation of the circle in degrees.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 148)
Returns:

This Path object.

Type
Phaser.Curves.Path

closePath()

Ensures that the Path is closed.

A closed Path starts and ends at the same point. If the Path is not closed, a straight Line Curve will be created from the ending point directly to the starting point. During the check, the actual starting point of the Path, i.e. the starting point of the first Curve, will be used as opposed to the Path's defined startPoint, which could differ.

Calling this method on an empty Path will result in an error.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 167)
Returns:

This Path object.

Type
Phaser.Curves.Path

cubicBezierTo(x, y, control1X [, control1Y] [, control2X] [, control2Y])

Creates a cubic bezier curve starting at the previous end point and ending at p3, using p1 and p2 as control points.

Parameters:
Name Type Argument Description
x number | Phaser.Math.Vector2

The x coordinate of the end point. Or, if a Vec2, the p1 value.

y number | Phaser.Math.Vector2

The y coordinate of the end point. Or, if a Vec2, the p2 value.

control1X number | Phaser.Math.Vector2

The x coordinate of the first control point. Or, if a Vec2, the p3 value.

control1Y number <optional>

The y coordinate of the first control point. Not used if vec2s are provided as the first 3 arguments.

control2X number <optional>

The x coordinate of the second control point. Not used if vec2s are provided as the first 3 arguments.

control2Y number <optional>

The y coordinate of the second control point. Not used if vec2s are provided as the first 3 arguments.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 194)
Returns:

This Path object.

Type
Phaser.Curves.Path

destroy()

[description]

Since: 3.0.0
Source: src/curves/path/Path.js (Line 794)

draw(graphics [, pointsTotal])

Draws all Curves in the Path to a Graphics Game Object.

Parameters:
Name Type Argument Default Description
graphics Phaser.GameObjects.Graphics

The Graphics Game Object to draw to.

pointsTotal integer <optional>
32

The number of points to draw for each Curve. Higher numbers result in a smoother curve but require more processing.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 269)
Returns:

The Graphics object which was drawn to.

Type
Phaser.GameObjects.Graphics

ellipseTo( [xRadius] [, yRadius] [, startAngle] [, endAngle] [, clockwise] [, rotation])

Creates an ellipse curve positioned at the previous end point, using the given parameters.

Parameters:
Name Type Argument Default Description
xRadius number <optional>
0

The horizontal radius of ellipse.

yRadius number <optional>
0

The vertical radius of ellipse.

startAngle integer <optional>
0

The start angle of the ellipse, in degrees.

endAngle integer <optional>
360

The end angle of the ellipse, in degrees.

clockwise boolean <optional>
false

Whether the ellipse angles are given as clockwise (true) or counter-clockwise (false).

rotation number <optional>
0

The rotation of the ellipse, in degrees.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 299)
Returns:

This Path object.

Type
Phaser.Curves.Path

fromJSON(data)

Creates a Path from a Path Configuration object.

The provided object should be a Phaser.Types.Curves.JSONPath, as returned by #toJSON. Providing a malformed object may cause errors.

Parameters:
Name Type Description
data Phaser.Types.Curves.JSONPath

The JSON object containing the Path data.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 331)
Returns:

This Path object.

Type
Phaser.Curves.Path

getBounds( [out] [, accuracy])

Returns a Rectangle with a position and size matching the bounds of this Path.

Parameters:
Name Type Argument Default Description
out Phaser.Geom.Rectangle <optional>

The Rectangle to store the bounds in.

accuracy integer <optional>
16

The accuracy of the bounds calculations. Higher values are more accurate at the cost of calculation speed.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 385)
Returns:

The modified out Rectangle, or a new Rectangle if none was provided.

Type
Phaser.Geom.Rectangle

getCurveLengths()

Returns an array containing the length of the Path at the end of each Curve.

The result of this method will be cached to avoid recalculating it in subsequent calls. The cache is only invalidated when the #curves array changes in length, leading to potential inaccuracies if a Curve in the Path is changed, or if a Curve is removed and another is added in its place.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 434)
Returns:

An array containing the length of the Path at the end of each one of its Curves.

Type
Array.<number>

getEndPoint( [out])

Returns the ending point of the Path.

A Path's ending point is equivalent to the ending point of the last Curve in the Path. For an empty Path, the ending point is at the Path's defined #startPoint.

Parameters:
Name Type Argument Description
out Phaser.Math.Vector2 <optional>

The object to store the point in.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 471)
Returns:

The modified out object, or a new Vector2 if none was provided.

Type
Phaser.Math.Vector2

getLength()

Returns the total length of the Path.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 501)
See:
  • #getCurveLengths
Returns:

The total length of the Path.

Type
number

getPoint(t [, out])

Calculates the coordinates of the point at the given normalized location (between 0 and 1) on the Path.

The location is relative to the entire Path, not to an individual Curve. A location of 0.5 is always in the middle of the Path and is thus an equal distance away from both its starting and ending points. In a Path with one Curve, it would be in the middle of the Curve; in a Path with two Curves, it could be anywhere on either one of them depending on their lengths.

Parameters:
Name Type Argument Description
t number

The location of the point to return, between 0 and 1.

out Phaser.Math.Vector2 <optional>

The object in which to store the calculated point.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 527)
Returns:

The modified out object, or a new Vector2 if none was provided.

Type
Phaser.Math.Vector2

getPoints( [divisions])

Returns the defined starting point of the Path.

This is not necessarily equal to the starting point of the first Curve if it differs from startPoint.

Parameters:
Name Type Argument Default Description
divisions integer <optional>
12

The number of points to divide the path in to.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 570)
Returns:

An array of Vector2 objects that containing the points along the Path.

Type
Array.<Phaser.Math.Vector2>

getRandomPoint( [out])

[description]

Parameters:
Name Type Argument Description
out Phaser.Math.Vector2 <optional>

Vector2 instance that should be used for storing the result. If undefined a new Vector2 will be created.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 626)
Returns:

[description]

Type
Phaser.Math.Vector2

getSpacedPoints( [divisions])

Creates a straight Line Curve from the ending point of the Path to the given coordinates.

Parameters:
Name Type Argument Default Description
divisions integer <optional>
40

The X coordinate of the line's ending point, or the line's ending point as a Vector2.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 645)
Returns:

[description]

Type
Array.<Phaser.Math.Vector2>

getStartPoint( [out])

[description]

Parameters:
Name Type Argument Description
out Phaser.Math.Vector2 <optional>

[description]

Since: 3.0.0
Source: src/curves/path/Path.js (Line 674)
Returns:

[description]

Type
Phaser.Math.Vector2

lineTo(x [, y])

Creates a line curve from the previous end point to x/y

Parameters:
Name Type Argument Description
x number | Phaser.Math.Vector2

[description]

y number <optional>

[description]

Since: 3.0.0
Source: src/curves/path/Path.js (Line 693)
Returns:

[description]

Type
Phaser.Curves.Path

moveTo(x, y)

[description]

Parameters:
Name Type Description
x number

[description]

y number

[description]

Since: 3.0.0
Source: src/curves/path/Path.js (Line 739)
Returns:

[description]

Type
Phaser.Curves.Path

quadraticBezierTo(x [, y] [, controlX] [, controlY])

Creates a Quadratic Bezier Curve starting at the ending point of the Path.

Parameters:
Name Type Argument Description
x number | Array.<Phaser.Math.Vector2>

The X coordinate of the second control point or, if it's a Vector2, the first control point.

y number <optional>

The Y coordinate of the second control point or, if x is a Vector2, the second control point.

controlX number <optional>

If x is not a Vector2, the X coordinate of the first control point.

controlY number <optional>

If x is not a Vector2, the Y coordinate of the first control point.

Since: 3.2.0
Source: src/curves/path/Path.js (Line 235)
Returns:

This Path object.

Type
Phaser.Curves.Path

splineTo(points)

[description]

Parameters:
Name Type Description
points Array.<Phaser.Math.Vector2>

[description]

Since: 3.0.0
Source: src/curves/path/Path.js (Line 722)
Returns:

[description]

Type
Phaser.Curves.Path

toJSON()

[description]

Since: 3.0.0
Source: src/curves/path/Path.js (Line 755)
Returns:

[description]

Type
Phaser.Types.Curves.JSONPath

updateArcLengths()

cacheLengths must be recalculated.

Since: 3.0.0
Source: src/curves/path/Path.js (Line 781)