Skip to main content
Version: Phaser v4.0.0

Curve

A Base Curve class, which all other curve types extend.

A Curve represents a mathematical path through 2D space and provides methods for sampling points, calculating arc lengths, and obtaining tangent vectors along it. Curves are the building blocks of Phaser.Curves.Path, which allows Game Objects to follow complex routes through a scene.

This class is not intended to be instantiated directly. Instead, use one of the concrete subclasses in the Phaser.Curves namespace, such as LineCurve, QuadraticBezier, CubicBezier, EllipseCurve, or SplineCurve.

Based on the three.js Curve classes created by zz85

Constructor

new Curve(type)

Parameters

nametypeoptionaldescription
typestringNoThe curve type.

Scope: static

Source: src/curves/Curve.js#L12
Since: 3.0.0

Public Members

active

active: boolean

Description:

For a curve on a Path, false means the Path will ignore this curve.

Source: src/curves/Curve.js#L89
Since: 3.0.0


arcLengthDivisions

arcLengthDivisions: number

Description:

The quantity of arc length divisions within the curve.

Source: src/curves/Curve.js#L59
Since: 3.0.0


cacheArcLengths

cacheArcLengths: Array.<number>

Description:

An array of cached arc length values.

Source: src/curves/Curve.js#L69
Since: 3.0.0


defaultDivisions

defaultDivisions: number

Description:

The default number of divisions within the curve.

Source: src/curves/Curve.js#L49
Since: 3.0.0


needsUpdate

needsUpdate: boolean

Description:

Does the data of this curve need updating?

Source: src/curves/Curve.js#L79
Since: 3.0.0


type

type: string

Description:

String based identifier for the type of curve.

Source: src/curves/Curve.js#L40
Since: 3.0.0


Public Methods

draw

<instance> draw(graphics, [pointsTotal])

Description:

Draws this curve on the given Graphics object.

The curve is drawn using Graphics.strokePoints so will be drawn at whatever the present Graphics stroke color is. The Graphics object is not cleared before the draw, so the curve will appear on-top of anything else already rendered to it.

Tags:

  • generic

Parameters:

nametypeoptionaldefaultdescription
graphicsPhaser.GameObjects.GraphicsNoThe Graphics instance onto which this curve will be drawn.
pointsTotalnumberYes32The resolution of the curve. The higher the value the smoother it will render, at the cost of rendering performance.

Returns: Phaser.GameObjects.Graphics - The Graphics object to which the curve was drawn.

Source: src/curves/Curve.js#L120
Since: 3.0.0


getBounds

<instance> getBounds([out], [accuracy])

Description:

Returns a Rectangle where the position and dimensions match the bounds of this Curve.

You can control the accuracy of the bounds. The value given is used to work out how many points to plot across the curve. Higher values are more accurate at the cost of calculation speed.

Parameters:

nametypeoptionaldefaultdescription
outPhaser.Geom.RectangleYesThe Rectangle to store the bounds in. If falsey a new object will be created.
accuracynumberYes16The accuracy of the bounds calculations.

Returns: Phaser.Geom.Rectangle - A Rectangle object holding the bounds of this curve. If out was given it will be this object.

Source: src/curves/Curve.js#L144
Since: 3.0.0


getDistancePoints

<instance> getDistancePoints(distance)

Description:

Returns an array of points, spaced out X distance pixels apart. The smaller the distance, the larger the array will be.

Parameters:

nametypeoptionaldescription
distancenumberNoThe distance, in pixels, between each point along the curve.

Returns: Array.<Phaser.Math.Vector2> - An Array of Vector2 objects.

Source: src/curves/Curve.js#L178
Since: 3.0.0


getEndPoint

<instance> getEndPoint([out])

Description:

Get a point at the end of the curve.

Parameters:

nametypeoptionaldescription
outPhaser.Math.Vector2YesOptional Vector object to store the result in.

Returns: Phaser.Math.Vector2 - Vector2 containing the coordinates of the curve's end point.

Source: src/curves/Curve.js#L198
Since: 3.0.0


getLength

<instance> getLength()

Description:

Returns the total arc length of the curve, in pixels. The length is calculated by summing the distances between sampled points along the curve.

Returns: number - The total length of the curve.

Source: src/curves/Curve.js#L215
Since: 3.0.0


getLengths

<instance> getLengths([divisions])

Description:

Get a list of cumulative segment lengths.

These lengths are calculated and cached the first time this method is called.

  • [0] 0

  • [1] The first segment

  • [2] The first and second segment

  • ...

  • [divisions] All segments

Parameters:

nametypeoptionaldescription
divisionsnumberYesThe number of divisions or segments.

Returns: Array.<number> - An array of cumulative lengths.

Source: src/curves/Curve.js#L231
Since: 3.0.0


getPointAt

<instance> getPointAt(u, [out])

Description:

Get a point at a relative position on the curve, by arc length.

Tags:

  • generic

Parameters:

nametypeoptionaldescription
unumberNoThe relative position, [0..1].
outPhaser.Math.Vector2YesA point to store the result in.

Returns: Phaser.Math.Vector2 - The point.

Source: src/curves/Curve.js#L287
Since: 3.0.0


getPoints

<instance> getPoints([divisions], [stepRate], [out])

Description:

Get a sequence of evenly spaced points from the curve.

You can pass divisions, stepRate, or neither.

The number of divisions will be

  1. divisions, if divisions > 0; or

  2. this.getLength / stepRate, if stepRate > 0; or

  3. this.defaultDivisions

1 + divisions points will be returned.

Tags:

  • generic

Parameters:

nametypeoptionaldescription
divisionsnumberYesThe number of divisions to make.
stepRatenumberYesThe curve distance between points, implying divisions.
outArray.<Phaser.Math.Vector2>YesAn optional array to store the points in.

Returns: Array.<Phaser.Math.Vector2> - An array of Vector2 points from the curve.

Source: src/curves/Curve.js#L309
Since: 3.0.0


getRandomPoint

<instance> getRandomPoint([out])

Description:

Get a random point from the curve.

Tags:

  • generic

Parameters:

nametypeoptionaldescription
outPhaser.Math.Vector2YesA point object to store the result in.

Returns: Phaser.Math.Vector2 - The point.

Source: src/curves/Curve.js#L358
Since: 3.0.0


getSpacedPoints

<instance> getSpacedPoints([divisions], [stepRate], [out])

Description:

Get a sequence of equally spaced points (by arc distance) from the curve.

1 + divisions points will be returned.

Parameters:

nametypeoptionaldefaultdescription
divisionsnumberYes"this.defaultDivisions"The number of divisions to make.
stepRatenumberYesStep between points. Used to calculate the number of points to return when divisions is falsy. Ignored if divisions is positive.
outArray.<Phaser.Math.Vector2>YesAn optional array to store the points in.

Returns: Array.<Phaser.Math.Vector2> - An array of Vector2 points.

Source: src/curves/Curve.js#L379
Since: 3.0.0


getStartPoint

<instance> getStartPoint([out])

Description:

Get a point at the start of the curve.

Tags:

  • generic

Parameters:

nametypeoptionaldescription
outPhaser.Math.Vector2YesA point to store the result in.

Returns: Phaser.Math.Vector2 - The point.

Source: src/curves/Curve.js#L420
Since: 3.0.0


getTangent

<instance> getTangent(t, [out])

Description:

Get a unit vector tangent at a relative position on the curve. If a subclass does not override this method with an analytic tangent derivation, the tangent is approximated by sampling two points a small delta apart and computing the normalized direction vector between them.

Tags:

  • generic

Parameters:

nametypeoptionaldescription
tnumberNoThe relative position on the curve, [0..1].
outPhaser.Math.Vector2YesA vector to store the result in.

Returns: Phaser.Math.Vector2 - Vector approximating the tangent line at the point t (delta +/- 0.0001)

Source: src/curves/Curve.js#L439
Since: 3.0.0


getTangentAt

<instance> getTangentAt(u, [out])

Description:

Get a unit vector tangent at a relative position on the curve, by arc length.

Tags:

  • generic

Parameters:

nametypeoptionaldescription
unumberNoThe relative position on the curve, [0..1].
outPhaser.Math.Vector2YesA vector to store the result in.

Returns: Phaser.Math.Vector2 - The tangent vector.

Source: src/curves/Curve.js#L481
Since: 3.0.0


getTFromDistance

<instance> getTFromDistance(distance, [divisions])

Description:

Given a distance in pixels along the curve, returns the corresponding t parameter value that can be used with getPoint() to find the position at that distance. This gives you equidistant points along the curve.

Parameters:

nametypeoptionaldescription
distancenumberNoThe distance, in pixels.
divisionsnumberYesOptional amount of divisions.

Returns: number - The t value (between 0 and 1) at the given distance along the curve.

Source: src/curves/Curve.js#L501
Since: 3.0.0


getUtoTmapping

<instance> getUtoTmapping(u, distance, [divisions])

Description:

Maps a uniform parameter u (0 to 1, distributed evenly by arc length) to the raw curve parameter t. This mapping ensures that points sampled at regular intervals of u will be equidistant along the curve, unlike the raw t parameter which may produce uneven spacing.

Parameters:

nametypeoptionaldescription
unumberNoA float between 0 and 1.
distancenumberNoThe distance, in pixels.
divisionsnumberYesOptional amount of divisions.

Returns: number - The equidistant value.

Source: src/curves/Curve.js#L522
Since: 3.0.0


updateArcLengths

<instance> updateArcLengths()

Description:

Calculate and cache the arc lengths.

Source: src/curves/Curve.js#L603
Since: 3.0.0