Documentation / @ripl/core / ContextPath
Class: ContextPath
Defined in: packages/core/src/context/path.ts:17
A virtual path element used to record drawing commands; subclassed by Canvas and SVG implementations.
Extended by
Implements
Constructors
Constructor
new ContextPath(
id?):ContextPath
Defined in: packages/core/src/context/path.ts:22
Parameters
| Parameter | Type |
|---|---|
id | string |
Returns
ContextPath
Properties
| Property | Modifier | Type | Description | Defined in |
|---|---|---|---|---|
id | readonly | string | Unique identifier for this path, used for SVG element diffing between frames. | packages/core/src/context/path.ts:20 |
Methods
addPath()
addPath(
path):void
Defined in: packages/core/src/context/path.ts:90
Appends the drawing commands of another path to this path.
Parameters
| Parameter | Type |
|---|---|
path | ContextPath |
Returns
void
arc()
arc(
x,y,radius,startAngle,endAngle,counterclockwise?):void
Defined in: packages/core/src/context/path.ts:27
Adds an arc centred at (x, y) with the given radius, sweeping from startAngle to endAngle.
Parameters
| Parameter | Type |
|---|---|
x | number |
y | number |
radius | number |
startAngle | number |
endAngle | number |
counterclockwise? | boolean |
Returns
void
arcTo()
arcTo(
x1,y1,x2,y2,radius):void
Defined in: packages/core/src/context/path.ts:32
Adds an arc tangent to the lines from the current point to (x1, y1) and from (x1, y1) to (x2, y2), with the given radius.
Parameters
| Parameter | Type |
|---|---|
x1 | number |
y1 | number |
x2 | number |
y2 | number |
radius | number |
Returns
void
bezierCurveTo()
bezierCurveTo(
cp1x,cp1y,cp2x,cp2y,x,y):void
Defined in: packages/core/src/context/path.ts:42
Adds a cubic Bézier curve to (x, y) using control points (cp1x, cp1y) and (cp2x, cp2y).
Parameters
| Parameter | Type |
|---|---|
cp1x | number |
cp1y | number |
cp2x | number |
cp2y | number |
x | number |
y | number |
Returns
void
circle()
circle(
x,y,radius):void
Defined in: packages/core/src/context/path.ts:37
Adds a full circle centred at (x, y) with the given radius.
Parameters
| Parameter | Type |
|---|---|
x | number |
y | number |
radius | number |
Returns
void
closePath()
closePath():
void
Defined in: packages/core/src/context/path.ts:47
Closes the current sub-path with a straight line back to its start point.
Returns
void
ellipse()
ellipse(
x,y,radiusX,radiusY,rotation,startAngle,endAngle,counterclockwise?):void
Defined in: packages/core/src/context/path.ts:52
Adds an ellipse centred at (x, y) with the given radii and rotation, sweeping from startAngle to endAngle.
Parameters
| Parameter | Type |
|---|---|
x | number |
y | number |
radiusX | number |
radiusY | number |
rotation | number |
startAngle | number |
endAngle | number |
counterclockwise? | boolean |
Returns
void
lineTo()
lineTo(
x,y):void
Defined in: packages/core/src/context/path.ts:57
Adds a straight line from the current point to (x, y).
Parameters
| Parameter | Type |
|---|---|
x | number |
y | number |
Returns
void
moveTo()
moveTo(
x,y):void
Defined in: packages/core/src/context/path.ts:62
Moves the current point to (x, y) without drawing, beginning a new sub-path.
Parameters
| Parameter | Type |
|---|---|
x | number |
y | number |
Returns
void
polyline()
polyline(
points):void
Defined in: packages/core/src/context/path.ts:82
Adds a connected series of straight line segments through the given points.
Parameters
| Parameter | Type |
|---|---|
points | Point[] |
Returns
void
quadraticCurveTo()
quadraticCurveTo(
cpx,cpy,x,y):void
Defined in: packages/core/src/context/path.ts:67
Adds a quadratic Bézier curve to (x, y) using control point (cpx, cpy).
Parameters
| Parameter | Type |
|---|---|
cpx | number |
cpy | number |
x | number |
y | number |
Returns
void
rect()
rect(
x,y,width,height):void
Defined in: packages/core/src/context/path.ts:72
Adds a rectangle with its top-left corner at (x, y) and the given width and height.
Parameters
| Parameter | Type |
|---|---|
x | number |
y | number |
width | number |
height | number |
Returns
void
roundRect()
roundRect(
x,y,width,height,radii?):void
Defined in: packages/core/src/context/path.ts:77
Adds a rectangle with rounded corners at (x, y) with the given width, height, and corner radii.
Parameters
| Parameter | Type |
|---|---|
x | number |
y | number |
width | number |
height | number |
radii? | BorderRadius |
Returns
void