EllipticalArc¶

Overview¶

An elliptical arc (a continuous sub-part of an ellipse).

Additional helpful notes: - http://www.w3.org/TR/SVG/implnote.html#PathElementImplementationNotes - http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-ellipse (note: context.ellipse was removed from the Canvas spec)

@author Jonathan Olson <jonathan.olson@colorado.edu>

Class EllipticalArc¶

import { EllipticalArc } from 'scenerystack/kite';

Constructor¶

new EllipticalArc( center : Vector2, radiusX : number, radiusY : number, rotation : number, startAngle : number, endAngle : number, anticlockwise : boolean )¶

Instance Methods¶

setCenter( center : Vector2 ) : this¶

Sets the center of the EllipticalArc.

getCenter() : Vector2¶

Returns the center of this EllipticalArc.

setRadiusX( radiusX : number ) : this¶

Sets the semi-major radius of the EllipticalArc.

getRadiusX() : number¶

Returns the semi-major radius of this EllipticalArc.

setRadiusY( radiusY : number ) : this¶

Sets the semi-minor radius of the EllipticalArc.

getRadiusY() : number¶

Returns the semi-minor radius of this EllipticalArc.

setRotation( rotation : number ) : this¶

Sets the rotation of the EllipticalArc.

getRotation() : number¶

Returns the rotation of this EllipticalArc.

setStartAngle( startAngle : number ) : this¶

Sets the startAngle of the EllipticalArc.

getStartAngle() : number¶

Returns the startAngle of this EllipticalArc.

setEndAngle( endAngle : number ) : this¶

Sets the endAngle of the EllipticalArc.

getEndAngle() : number¶

Returns the endAngle of this EllipticalArc.

setAnticlockwise( anticlockwise : boolean ) : this¶

Sets the anticlockwise of the EllipticalArc.

getAnticlockwise() : boolean¶

Returns the anticlockwise of this EllipticalArc.

positionAt( t : number ) : Vector2¶

Returns the position parametrically, with 0 <= t <= 1.

NOTE: positionAt( 0 ) will return the start of the segment, and positionAt( 1 ) will return the end of the segment.

This method is part of the Segment API. See Segment.js's constructor for more API documentation.

tangentAt( t : number ) : Vector2¶

Returns the non-normalized tangent (dx/dt, dy/dt) of this segment at the parametric value of t, with 0 <= t <= 1.

NOTE: tangentAt( 0 ) will return the tangent at the start of the segment, and tangentAt( 1 ) will return the tangent at the end of the segment.

This method is part of the Segment API. See Segment.js's constructor for more API documentation.

curvatureAt( t : number ) : number¶

Returns the signed curvature of the segment at the parametric value t, where 0 <= t <= 1.

The curvature will be positive for visual clockwise / mathematical counterclockwise curves, negative for opposite curvature, and 0 for no curvature.

NOTE: curvatureAt( 0 ) will return the curvature at the start of the segment, and curvatureAt( 1 ) will return the curvature at the end of the segment.

This method is part of the Segment API. See Segment.js's constructor for more API documentation.

subdivided( t : number ) : EllipticalArc[]¶

Returns an array with up to 2 sub-segments, split at the parametric t value. Together (in order) they should make up the same shape as the current segment.

This method is part of the Segment API. See Segment.js's constructor for more API documentation.

invalidate()¶

Clears cached information, should be called when any of the 'constructor arguments' are mutated.

getUnitTransform() : Transform3¶

Computes a transform that maps a unit circle into this ellipse's location.

Helpful, since we can get the parametric position of our unit circle (at t), and then transform it with this transform to get the ellipse's parametric position (at t).

getStart() : Vector2¶

Gets the start point of this ellipticalArc

getEnd() : Vector2¶

Gets the end point of this ellipticalArc

getStartTangent() : Vector2¶

Gets the tangent vector (normalized) to this ellipticalArc at the start, pointing in the direction of motion (from start to end)

getEndTangent() : Vector2¶

Gets the tangent vector (normalized) to this ellipticalArc at the end point, pointing in the direction of motion (from start to end)

getActualEndAngle() : number¶

Gets the end angle in radians

getIsFullPerimeter() : boolean¶

Returns a boolean value that indicates if the arc wraps up by more than two Pi

getAngleDifference() : number¶

Returns an angle difference that represents how "much" of the circle our arc covers

The answer is always greater or equal to zero The answer can exceed two Pi

getUnitArcSegment() : Arc¶

A unit arg segment that we can map to our ellipse. useful for hit testing and such.

getBounds() : Bounds2¶

Returns the bounds of this segment.

getNondegenerateSegments() : Segment[]¶

Returns a list of non-degenerate segments that are equivalent to this segment. Generally gets rid (or simplifies) invalid or repeated segments.

mapAngle( angle : number ) : number¶

Maps a contained angle to between [startAngle,actualEndAngle), even if the end angle is lower.

TODO: remove duplication with Arc https://github.com/phetsims/kite/issues/76

tAtAngle( angle : number ) : number¶

Returns the parametrized value t for a given angle. The value t should range from 0 to 1 (inclusive).

TODO: remove duplication with Arc https://github.com/phetsims/kite/issues/76

angleAt( t : number ) : number¶

Returns the angle for the parametrized t value. The t value should range from 0 to 1 (inclusive).

positionAtAngle( angle : number ) : Vector2¶

Returns the position of this arc at angle.

tangentAtAngle( angle : number ) : Vector2¶

Returns the normalized tangent of this arc. The tangent points outward (inward) of this arc for clockwise (anticlockwise) direction.

offsetTo( r : number, reverse : boolean ) : Line[]¶

Returns an array of straight lines that will draw an offset on the logical left (right) side for reverse false (true) It discretizes the elliptical arc in 32 segments and returns an offset curve as a list of lineTos/

@param r - distance @param reverse

getSVGPathFragment() : string¶

Returns a string containing the SVG path. assumes that the start point is already provided, so anything that calls this needs to put the M calls first.

strokeLeft( lineWidth : number ) : Line[]¶

Returns an array of straight lines that will draw an offset on the logical left side.

strokeRight( lineWidth : number ) : Line[]¶

Returns an array of straight lines that will draw an offset curve on the logical right side.

getInteriorExtremaTs() : number[]¶

Returns a list of t values where dx/dt or dy/dt is 0 where 0 < t < 1. subdividing on these will result in monotonic segments Does not include t=0 and t=1.

intersection( ray : Ray2 ) : RayIntersection[]¶

Hit-tests this segment with the ray. An array of all intersections of the ray with this segment will be returned. For details, see the documentation in Segment.js

windingIntersection( ray : Ray2 ) : number¶

Returns the resultant winding number of this ray intersecting this arc.

writeToContext( context : CanvasRenderingContext2D )¶

Draws this arc to the 2D Canvas context, assuming the context's current location is already at the start point

transformed( matrix : Matrix3 ) : EllipticalArc¶

Returns this elliptical arc transformed by a matrix

getSignedAreaFragment() : number¶

Returns the contribution to the signed area computed using Green's Theorem, with P=-y/2 and Q=x/2.

NOTE: This is this segment's contribution to the line integral (-y/2 dx + x/2 dy).

reversed() : EllipticalArc¶

Returns a reversed copy of this segment (mapping the parametrization from [0,1] => [1,0]).

serialize() : SerializedEllipticalArc¶

Returns an object form that can be turned back into a segment with the corresponding deserialize method.

getOverlaps( segment : Segment, epsilon ) : Overlap[] | null¶

Determine whether two lines overlap over a continuous section, and if so finds the a,b pair such that p( t ) === q( a * t + b ).

@param segment @param [epsilon] - Will return overlaps only if no two corresponding points differ by this amount or more in one component. @returns - The solution, if there is one (and only one)

getConicMatrix() : Matrix3¶

Returns the matrix representation of the conic section of the ellipse. See https://en.wikipedia.org/wiki/Matrix_representation_of_conic_sections

Static Methods¶

deserialize( obj : SerializedEllipticalArc ) : EllipticalArc¶

Returns an EllipticalArc from the serialized representation.

getOverlapType( a : EllipticalArc, b : EllipticalArc, epsilon ) : EllipticalArcOverlapType¶

Returns what type of overlap is possible based on the center/radii/rotation. We ignore the start/end angles and anticlockwise information, and determine if the FULL ellipses overlap.

getOverlaps( a : EllipticalArc, b : EllipticalArc ) : Overlap[]¶

Determine whether two elliptical arcs overlap over continuous sections, and if so finds the a,b pairs such that p( t ) === q( a * t + b ).

@returns - Any overlaps (from 0 to 2)

intersect( a : EllipticalArc, b : EllipticalArc, epsilon ) : SegmentIntersection[]¶

Returns any (finite) intersection between the two elliptical arc segments.

computeUnitMatrix( center : Vector2, radiusX : number, radiusY : number, rotation : number ) : Matrix3¶

Matrix that transforms the unit circle into our ellipse

computeUnitTransform( center : Vector2, radiusX : number, radiusY : number, rotation : number ) : Transform3¶

Transforms the unit circle into our ellipse.

adapted from http://www.w3.org/TR/SVG/implnote.html#PathElementImplementationNotes

Type SerializedEllipticalArc¶

import type { SerializedEllipticalArc } from 'scenerystack/kite';

• type: "EllipticalArc"
• centerX: number
• centerY: number
• radiusX: number
• radiusY: number
• rotation: number
• startAngle: number
• endAngle: number
• anticlockwise: boolean

Source Code¶

See the source for EllipticalArc.ts in the kite repository.