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 centered 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 centered 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 centered 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