Documentation / @ripl/svg / SVGPath

Class: SVGPath

Defined in: svg/src/path.ts:19

SVG-specific path implementation that builds an SVG d attribute string from drawing commands.

Extends

• ContextPath

Implements

• SVGContextElement

Constructors

Constructor

new SVGPath(id?): SVGPath

Defined in: svg/src/path.ts:24

Parameters

Parameter	Type
id?	string

Returns

SVGPath

Overrides

ContextPath.constructor

Properties

Property	Modifier	Type	Description	Inherited from	Defined in
definition	public	SVGContextElementDefinition	The rendering definition describing this path's SVG <path> node.	-	svg/src/path.ts:22
id	readonly	string	Unique identifier for this path, used for SVG element diffing between frames.	SVGContextElement.id ContextPath.id	core/src/context/path.ts:20

Methods

addPath()

addPath(path): void

Defined in: core/src/context/path.ts:90

Appends the drawing commands of another path to this path.

Parameters

Parameter	Type
path	ContextPath

Returns

void

Inherited from

ContextPath.addPath

---

arc()

arc(x, y, radius, startAngle, endAngle, counterclockwise?): void

Defined in: svg/src/path.ts:60

Adds an arc centered at (x, y) with the given radius to the path.

Parameters

Parameter	Type
x	number
y	number
radius	number
startAngle	number
endAngle	number
counterclockwise?	boolean

Returns

void

Overrides

ContextPath.arc

---

arcTo()

arcTo(x1, y1, x2, y2, radius): void

Defined in: svg/src/path.ts:88

Adds an arc connecting two tangents defined by the given points to the path.

Parameters

Parameter	Type
x1	number
y1	number
x2	number
y2	number
radius	number

Returns

void

Overrides

ContextPath.arcTo

---

bezierCurveTo()

bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y): void

Defined in: svg/src/path.ts:101

Adds a cubic Bézier curve to the path.

Parameters

Parameter	Type
cp1x	number
cp1y	number
cp2x	number
cp2y	number
x	number
y	number

Returns

void

Overrides

ContextPath.bezierCurveTo

---

circle()

circle(x, y, radius): void

Defined in: svg/src/path.ts:94

Adds a full circle centered at (x, y) to the path.

Parameters

Parameter	Type
x	number
y	number
radius	number

Returns

void

Overrides

ContextPath.circle

---

closePath()

closePath(): void

Defined in: svg/src/path.ts:106

Closes the current sub-path with a straight line back to its start.

Returns

void

Overrides

ContextPath.closePath

---

ellipse()

ellipse(x, y, radiusX, radiusY, rotation, startAngle, endAngle, counterclockwise?): void

Defined in: svg/src/path.ts:112

Adds an elliptical arc centered at (x, y) to the path.

Parameters

Parameter	Type
x	number
y	number
radiusX	number
radiusY	number
rotation	number
startAngle	number
endAngle	number
counterclockwise?	boolean

Returns

void

Overrides

ContextPath.ellipse

---

lineTo()

lineTo(x, y): void

Defined in: svg/src/path.ts:150

Adds a straight line from the current point to (x, y).

Parameters

Parameter	Type
x	number
y	number

Returns

void

Overrides

ContextPath.lineTo

---

moveTo()

moveTo(x, y): void

Defined in: svg/src/path.ts:155

Moves the current point to (x, y) without adding a line.

Parameters

Parameter	Type
x	number
y	number

Returns

void

Overrides

ContextPath.moveTo

---

polyline()

polyline(points): void

Defined in: 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

Inherited from

ContextPath.polyline

---

quadraticCurveTo()

quadraticCurveTo(cpx, cpy, x, y): void

Defined in: svg/src/path.ts:161

Adds a quadratic Bézier curve to the path.

Parameters

Parameter	Type
cpx	number
cpy	number
x	number
y	number

Returns

void

Overrides

ContextPath.quadraticCurveTo

---

rect()

rect(x, y, width, height): void

Defined in: svg/src/path.ts:166

Adds a rectangle to the path.

Parameters

Parameter	Type
x	number
y	number
width	number
height	number

Returns

void

Overrides

ContextPath.rect

---

roundRect()

roundRect(x, y, width, height, radii?): void

Defined in: svg/src/path.ts:175

Adds a rounded rectangle to the path, using the given corner radii.

Parameters

Parameter	Type
x	number
y	number
width	number
height	number
radii?	BorderRadius

Returns

void

Overrides

ContextPath.roundRect