Interface Path2D
interface Path2D {
addPath(path: Path2D, transform?: DOMMatrix2DInit): void;
arc(
x: number,
y: number,
radius: number,
startAngle: number,
endAngle: number,
counterclockwise?: boolean,
): void;
arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void;
bezierCurveTo(
cp1x: number,
cp1y: number,
cp2x: number,
cp2y: number,
x: number,
y: number,
): void;
closePath(): void;
ellipse(
x: number,
y: number,
radiusX: number,
radiusY: number,
rotation: number,
startAngle: number,
endAngle: number,
counterclockwise?: boolean,
): void;
lineTo(x: number, y: number): void;
moveTo(x: number, y: number): void;
quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void;
rect(x: number, y: number, w: number, h: number): void;
roundRect(
x: number,
y: number,
w: number,
h: number,
radii?: number | DOMPointInit | (number | DOMPointInit)[],
): void;
roundRect(
x: number,
y: number,
w: number,
h: number,
radii?: number | DOMPointInit | Iterable<number | DOMPointInit, any, any>,
): void;
}
addPath(path: Path2D, transform?: DOMMatrix2DInit): void;
arc(
x: number,
y: number,
radius: number,
startAngle: number,
endAngle: number,
counterclockwise?: boolean,
): void;
arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void;
bezierCurveTo(
cp1x: number,
cp1y: number,
cp2x: number,
cp2y: number,
x: number,
y: number,
): void;
closePath(): void;
ellipse(
x: number,
y: number,
radiusX: number,
radiusY: number,
rotation: number,
startAngle: number,
endAngle: number,
counterclockwise?: boolean,
): void;
lineTo(x: number, y: number): void;
moveTo(x: number, y: number): void;
quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void;
rect(x: number, y: number, w: number, h: number): void;
roundRect(
x: number,
y: number,
w: number,
h: number,
radii?: number | DOMPointInit | (number | DOMPointInit)[],
): void;
roundRect(
x: number,
y: number,
w: number,
h: number,
radii?: number | DOMPointInit | Iterable<number | DOMPointInit, any, any>,
): void;
}
Hierarchy
- CanvasPath
- Path2D
Methods
addPath
The
Path2D.addPath()method of the Canvas 2D API adds one Path2D object to anotherPath2Dobject.Parameters
- path: Path2D
Optionaltransform: DOMMatrix2DInit
Returns void
arc
arcTo
bezierCurveTo
Parameters
- cp1x: number
- cp1y: number
- cp2x: number
- cp2y: number
- x: number
- y: number
Returns void
closePath
Returns void
ellipse
- ellipse(
x: number,
y: number,
radiusX: number,
radiusY: number,
rotation: number,
startAngle: number,
endAngle: number,
counterclockwise?: boolean,
): voidParameters
- x: number
- y: number
- radiusX: number
- radiusY: number
- rotation: number
- startAngle: number
- endAngle: number
Optionalcounterclockwise: boolean
Returns void
lineTo
moveTo
quadraticCurveTo
rect
roundRect
- roundRect(
x: number,
y: number,
w: number,
h: number,
radii?: number | DOMPointInit | (number | DOMPointInit)[],
): voidParameters
- x: number
- y: number
- w: number
- h: number
Optionalradii: number | DOMPointInit | (number | DOMPointInit)[]
Returns void
- roundRect(
x: number,
y: number,
w: number,
h: number,
radii?: number | DOMPointInit | Iterable<number | DOMPointInit, any, any>,
): voidParameters
- x: number
- y: number
- w: number
- h: number
Optionalradii: number | DOMPointInit | Iterable<number | DOMPointInit, any, any>
Returns void
The
Path2Dinterface of the Canvas 2D API is used to declare a path that can then be used on a CanvasRenderingContext2D object.MDN Reference