new Hermite(p1x, p1y, p2x, p2y, v1x, v1y, v2x, v2y, accuracy)
A data representation of a Hermite Curve (see http://en.wikipedia.org/wiki/Cubic_Hermite_spline)
A Hermite curve has a start and end point and tangent vectors for both of them.
The curve will always pass through the two control points and the shape of it is controlled
by the length and direction of the tangent vectors. At the control points the curve will
be facing exactly in the vector direction.
As these curves change speed (speed = distance between points separated by an equal change in
't' value - see Hermite.getPoint) this class attempts to reduce the variation by pre-calculating
the accuracy
number of points on the curve. The straight-line distances to these points are stored
in the private 'points' array, and this information is used by Hermite.findT() to convert a pixel
distance along the curve into a 'time' value.
Higher accuracy
values will result in more even movement, but require more memory for the points
list. 5 works, but 10 seems to be an ideal value for the length of curves found in most games on
a desktop screen. If you use very long curves (more than 400 pixels) you may need to increase
this value further.
Parameters
Name | Type | Argument | Default | Description |
---|---|---|---|---|
p1x |
number | The x coordinate of the start of the curve. |
||
p1y |
number | The y coordinate of the start of the curve. |
||
p2x |
number | The x coordinate of the end of the curve. |
||
p2y |
number | The y coordinate of the end of the curve. |
||
v1x |
number | The x component of the tangent vector for the start of the curve. |
||
v1y |
number | The y component of the tangent vector for the start of the curve. |
||
v2x |
number | The x component of the tangent vector for the end of the curve. |
||
v2y |
number | The y component of the tangent vector for the end of the curve. |
||
accuracy |
number |
<optional> |
10 | The amount of points to pre-calculate on the curve. |
- Source code: geom/Hermite.js (Line 39)
Public Properties
-
accuracy : number
-
The amount of points to pre-calculate on the curve.
- Source code: geom/Hermite.js (Line 396)
-
p1x : number
-
The x coordinate of the start of the curve. Setting this value will recalculate the curve.
- Source code: geom/Hermite.js (Line 420)
-
p1y : number
-
The y coordinate of the start of the curve. Setting this value will recalculate the curve.
- Source code: geom/Hermite.js (Line 444)
-
p2x : number
-
The x coordinate of the end of the curve. Setting this value will recalculate the curve.
- Source code: geom/Hermite.js (Line 468)
-
p2y : number
-
The y coordinate of the end of the curve. Setting this value will recalculate the curve.
- Source code: geom/Hermite.js (Line 492)
-
v1x : number
-
The x component of the tangent vector for the start of the curve. Setting this value will recalculate the curve.
- Source code: geom/Hermite.js (Line 516)
-
v1y : number
-
The y component of the tangent vector for the start of the curve. Setting this value will recalculate the curve.
- Source code: geom/Hermite.js (Line 540)
-
v2x : number
-
The x component of the tangent vector for the end of the curve. Setting this value will recalculate the curve.
- Source code: geom/Hermite.js (Line 564)
-
v2y : number
-
The y component of the tangent vector for the end of the curve. Setting this value will recalculate the curve.
- Source code: geom/Hermite.js (Line 588)
Public Methods
-
calculateEvenPoints() → {number}
-
Calculate a number of points along the curve, based on
Hermite.accuracy
, and stores them in the private_points
array.Returns
number -The total length of the curve approximated as straight line distances between the points.
- Source code: geom/Hermite.js (Line 146)
-
findT(distance) → {number}
-
Convert a distance along this curve into a
time
value which will be between 0 and 1.For example if this curve has a length of 100 pixels then
findT(50)
would return0.5
.Parameters
Name Type Description distance
integer The distance into the curve in pixels. Should be a positive integer.
Returns
number -The time (
t
) value, a float between 0 and 1.- Source code: geom/Hermite.js (Line 173)
-
getAngle(t) → {number}
-
Calculate and return the angle, in radians, of the curves tangent based on time.
Parameters
Name Type Argument Default Description t
number <optional>
0 The
t
(time) value at which to find the angle. Must be between 0 and 1.Returns
number -The angle of the line at the specified
t
time value along the curve. The value is in radians.- Source code: geom/Hermite.js (Line 336)
-
getAngleWithDistance(distance) → {number}
-
Calculate and return the angle, in radians, of the curves tangent at the given pixel distance along the curves length.
Parameters
Name Type Argument Default Description distance
number <optional>
0 The distance along the curve to get the angle from, in pixels.
Returns
number -The angle of the line at the specified distance along the curve. The value is in radians.
- Source code: geom/Hermite.js (Line 354)
-
getEntryTangent(point) → {Phaser.Point}
-
Get the angle of the curves entry point.
Parameters
Name Type Description point
Phaser.Point | Object The Phaser.Point object, or an Object with public
x
andy
properties, in which the tangent vector values will be stored.Returns
A Point object containing the tangent vector of this Hermite curve.
- Source code: geom/Hermite.js (Line 376)
-
getPoint(t, point) → {Phaser.Point}
-
Get a point on the curve using the
t
(time) value, which must be between 0 and 1.Parameters
Name Type Argument Default Description t
number <optional>
0 The time value along the curve from which to extract a point. This is a value between 0 and 1, where 0 represents the start of the curve and 1 the end.
point
Phaser.Point | Object <optional>
An optional Phaser.Point, or Object containing public
x
andy
properties. If given the resulting values will be stored in the Objectsx
andy
properties. If omitted a new Phaser.Point object is created.Returns
An Object with the x, y coordinate of the curve at the specified
t
value set in itsx
andy
properties.- Source code: geom/Hermite.js (Line 276)
-
getPointWithDistance(distance, point) → {Phaser.Point}
-
Get a point on the curve using the distance, in pixels, along the curve.
Parameters
Name Type Argument Default Description distance
integer <optional>
0 The distance along the curve to get the point from, given in pixels.
point
Phaser.Point | Object <optional>
An optional Phaser.Point, or Object containing public
x
andy
properties. If given the resulting values will be stored in the Objectsx
andy
properties. If omitted a new Phaser.Point object is created.Returns
The point on the line at the specified 'distance' along the curve.
- Source code: geom/Hermite.js (Line 309)
-
getX(t) → {number}
-
Get the X component of a point on the curve based on the
t
(time) value, which must be between 0 and 1.Parameters
Name Type Argument Default Description t
number <optional>
0 The time value along the curve from which to extract a point. This is a value between 0 and 1, where 0 represents the start of the curve and 1 the end.
Returns
number -The X component of a point on the curve based on the
t
(time) value.- Source code: geom/Hermite.js (Line 210)
-
getY(t) → {number}
-
Get the Y component of a point on the curve based on the
t
(time) value, which must be between 0 and 1.Parameters
Name Type Argument Default Description t
number <optional>
0 The time value along the curve from which to extract a point. This is a value between 0 and 1, where 0 represents the start of the curve and 1 the end.
Returns
number -The Y component of a point on the curve based on the
t
(time) value.- Source code: geom/Hermite.js (Line 243)
-
recalculate() → {Phaser.Hermite}
-
Performs the curve calculations.
This is called automatically if you change any of the curves public properties, such as
Hermite.p1x
orHermite.v2y
.If you adjust any of the internal private values, then call this to update the points.
Returns
This object.
- Source code: geom/Hermite.js (Line 123)