EllipseCurve | ngx3js

Creates a 2d curve in the shape of an ellipse. Setting the xRadius equal to the yRadius will result in a circle.

Code Example

const curve = new THREE.EllipseCurve(
      0,   0, // ax, aY
    10, 10, // xRadius, yRadius
      0,  2 * Math.PI,  // aStartAngle, aEndAngle
    false,  // aClockwise
    0 // aRotation
);
const points = curve.getPoints( 50 );
const geometry = new THREE.BufferGeometry().setFromPoints( points );
const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
// Create the final object to add to the scene
const ellipse = new THREE.Line( geometry, material );

Hierarchy

I3JS.Curve<I3JS.Vector2>
- EllipseCurve
  - I3JS.ArcCurve

Index

Constructors

constructor

new EllipseCurve(aX: number, aY: number, xRadius: number, yRadius: number, aStartAngle: number, aEndAngle: number, aClockwise: boolean, aRotation: number): I3JS.EllipseCurve
new EllipseCurve(): I3JS.EllipseCurve

Inherited from Curve.constructor
- Defined in lib/threejs-library/types/three/extras.ts:774
Parameters
- aX: number
  
  – The X center of the ellipse. Default is 0.
- aY: number
  
  – The Y center of the ellipse. Default is 0.
- xRadius: number
  
  – The radius of the ellipse in the x direction. Default is 1.
- yRadius: number
  
  – The radius of the ellipse in the y direction. Default is 1.
- aStartAngle: number
  
  – The start angle of the curve in radians starting from the positive X axis. Default is 0.
- aEndAngle: number
  
  – The end angle of the curve in radians starting from the positive X axis. Default is 2 x Math.PI.
- aClockwise: boolean
  
  – Whether the ellipse is drawn clockwise. Default is false.
- aRotation: number
  
  – The rotation angle of the ellipse in radians, counterclockwise from the positive X axis Default is 0.
Returns I3JS.EllipseCurve
Inherited from Curve<Vector2>.constructor
- Defined in lib/threejs-library/types/three/extras.ts:120
This constructor creates a new Curve.

Returns I3JS.EllipseCurve

Properties

aClockwise

aClockwise: boolean

Whether the ellipse is drawn clockwise.

default: false

aEndAngle

aEndAngle: number

The end angle of the curve in radians starting from the middle right side.

default: 2 * Math.PI

aRotation

aRotation: number

The rotation angle of the ellipse in radians, counterclockwise from the positive X axis Default is 0.

default: 0

aStartAngle

aStartAngle: number

The start angle of the curve in radians starting from the middle right side.

default: 0

aX

aX: number

The X center of the ellipse.

default: 0

aY

aY: number

The Y center of the ellipse.

default: 0

arcLengthDivisions

arcLengthDivisions: number

This value determines the amount of divisions when calculating the cumulative segment lengths of a curve via .getLengths. To ensure precision when using methods like .getSpacedPoints, it is recommended to increase .arcLengthDivisions if the curve is very large. Default is 200.

default: 200

type

type: string

default: 'EllipseCurve'

xRadius

xRadius: number

The radius of the ellipse in the x direction.

default: 1

yRadius

yRadius: number

The radius of the ellipse in the y direction.

default: 1

Methods

clone

clone(): I3JS.EllipseCurve

Inherited from Curve.clone
- Defined in lib/threejs-library/types/three/extras.ts:210
Creates a clone of this instance.

Returns I3JS.EllipseCurve

computeFrenetFrames

computeFrenetFrames(segments: number, closed?: boolean): { binormals: I3JS.Vector3[]; normals: I3JS.Vector3[]; tangents: I3JS.Vector3[] }

Inherited from Curve.computeFrenetFrames
- Defined in lib/threejs-library/types/three/extras.ts:198
Generates the Frenet Frames. Requires a curve definition in 3D space. Used in geometries like TubeGeometry or ExtrudeGeometry.

Parameters
- segments: number
- Optional closed: boolean
Returns { binormals: I3JS.Vector3[]; normals: I3JS.Vector3[]; tangents: I3JS.Vector3[] }
- binormals: I3JS.Vector3[]
- normals: I3JS.Vector3[]
- tangents: I3JS.Vector3[]

copy

copy(source: I3JS.Curve<I3JS.Vector2>): I3JS.EllipseCurve

Inherited from Curve.copy
- Defined in lib/threejs-library/types/three/extras.ts:215
Copies another Curve object to this instance.

Parameters
- source: I3JS.Curve<I3JS.Vector2>
Returns I3JS.EllipseCurve

fromJSON

fromJSON(json: object): I3JS.EllipseCurve

Inherited from Curve.fromJSON
- Defined in lib/threejs-library/types/three/extras.ts:225
Copies the data from the given JSON object to this instance.

Parameters
- json: object
Returns I3JS.EllipseCurve

getLength

getLength(): number

Inherited from Curve.getLength
- Defined in lib/threejs-library/types/three/extras.ts:163
Get total curve arc length.

Returns number

getLengths

getLengths(divisions?: number): number[]

Inherited from Curve.getLengths
- Defined in lib/threejs-library/types/three/extras.ts:168
Get list of cumulative segment lengths.

Parameters
- Optional divisions: number
Returns number[]

getPoint

getPoint(t: number, optionalTarget?: I3JS.Vector2): I3JS.Vector2

Inherited from Curve.getPoint
- Defined in lib/threejs-library/types/three/extras.ts:139
Parameters
- t: number
  
  A position on the curve. Must be in the range [ 0, 1 ].
- Optional optionalTarget: I3JS.Vector2
  
  If specified, the result will be copied into this Vector, otherwise a new Vector will be created.
Returns I3JS.Vector2
Returns a vector for a given position on the curve.

getPointAt

getPointAt(u: number, optionalTarget?: I3JS.Vector2): I3JS.Vector2

Inherited from Curve.getPointAt
- Defined in lib/threejs-library/types/three/extras.ts:146
Parameters
- u: number
  
  A position on the curve according to the arc length. Must be in the range [ 0, 1 ].
- Optional optionalTarget: I3JS.Vector2
  
  If specified, the result will be copied into this Vector, otherwise a new Vector will be created.
Returns I3JS.Vector2
Returns a vector for a given position on the curve according to the arc length.

getPoints

getPoints(divisions?: number): I3JS.Vector2[]

Inherited from Curve.getPoints
- Defined in lib/threejs-library/types/three/extras.ts:152
Parameters
- Optional divisions: number
Returns I3JS.Vector2[]
Returns a set of divisions + 1 points using getPoint( t ).

getSpacedPoints

getSpacedPoints(divisions?: number): I3JS.Vector2[]

Inherited from Curve.getSpacedPoints
- Defined in lib/threejs-library/types/three/extras.ts:158
Parameters
- Optional divisions: number
Returns I3JS.Vector2[]
Returns a set of divisions + 1 equi-spaced points using getPointAt( u ).

getTangent

getTangent(t: number, optionalTarget?: I3JS.Vector2): I3JS.Vector2

Inherited from Curve.getTangent
- Defined in lib/threejs-library/types/three/extras.ts:186
Parameters
- t: number
  
  A position on the curve. Must be in the range [ 0, 1 ].
- Optional optionalTarget: I3JS.Vector2
  
  If specified, the result will be copied into this Vector, otherwise a new Vector will be created.
Returns I3JS.Vector2
Returns a unit vector tangent at t. If the derived curve does not implement its tangent derivation, two points a small delta apart will be used to find its gradient which seems to give a reasonable approximation.

getTangentAt

getTangentAt(u: number, optionalTarget?: I3JS.Vector2): I3JS.Vector2

Inherited from Curve.getTangentAt
- Defined in lib/threejs-library/types/three/extras.ts:193
Parameters
- u: number
  
  A position on the curve according to the arc length. Must be in the range [ 0, 1 ].
- Optional optionalTarget: I3JS.Vector2
  
  If specified, the result will be copied into this Vector, otherwise a new Vector will be created.
Returns I3JS.Vector2
Returns tangent at a point which is equidistant to the ends of the curve from the point given in .getTangent.

getUtoTmapping

getUtoTmapping(u: number, distance: number): number

Inherited from Curve.getUtoTmapping
- Defined in lib/threejs-library/types/three/extras.ts:179
Given u in the range ( 0 .. 1 ), returns t also in the range ( 0 .. 1 ). u and t can then be used to give you points which are equidistant from the ends of the curve, using .getPoint.

Parameters
- u: number
- distance: number
Returns number

toJSON

toJSON(): object

Inherited from Curve.toJSON
- Defined in lib/threejs-library/types/three/extras.ts:220
Returns object
Returns a JSON object representation of this instance.

updateArcLengths

updateArcLengths(): void

Inherited from Curve.updateArcLengths
- Defined in lib/threejs-library/types/three/extras.ts:174
Update the cumlative segment distance cache. The method must be called every time curve parameters are changed. If an updated curve is part of a composed curve like CurvePath, .updateArcLengths() must be called on the composed curve, too.

Returns void

Code Example

Hierarchy

Index

Constructors

Properties

Methods

Constructors

constructor

Parameters

aX: number

aY: number

xRadius: number

yRadius: number

aStartAngle: number

aEndAngle: number

aClockwise: boolean

aRotation: number

Returns I3JS.EllipseCurve

Returns I3JS.EllipseCurve

Properties

aClockwise

aEndAngle

aRotation

aStartAngle

aX

aY

arcLengthDivisions

type

xRadius

yRadius

Methods

clone

Returns I3JS.EllipseCurve

computeFrenetFrames

Parameters

segments: number

Optional closed: boolean

Returns { binormals: I3JS.Vector3[]; normals: I3JS.Vector3[]; tangents: I3JS.Vector3[] }

binormals: I3JS.Vector3[]

normals: I3JS.Vector3[]

tangents: I3JS.Vector3[]

copy

Parameters

source: I3JS.Curve<I3JS.Vector2>

Returns I3JS.EllipseCurve

fromJSON

Parameters

json: object

Returns I3JS.EllipseCurve

getLength

Returns number

getLengths

Parameters

Optional divisions: number

Returns number[]

getPoint

Parameters

t: number

Optional optionalTarget: I3JS.Vector2

Returns I3JS.Vector2

getPointAt

Parameters

u: number

Optional optionalTarget: I3JS.Vector2

Returns I3JS.Vector2

getPoints

Parameters

Optional divisions: number

Returns I3JS.Vector2[]

getSpacedPoints

Parameters

Optional divisions: number

Returns I3JS.Vector2[]

getTangent

Parameters

t: number

Optional optionalTarget: I3JS.Vector2

Returns I3JS.Vector2

getTangentAt

Parameters