The linePath() function is used to draw and return a Path2D line.
import { linePath } from 'mz-canvas';
const line: Path2D = linePath({
x1: 0,
y1: 0,
x2: 300,
y2: 300,
});
// Do something with Path2D object
console.log(line);
You can also create a Path2D object and draw it right away:
import { canvas, rectPath } from 'mz-canvas';
const { ctx, $canvas } = canvas({
width: 600,
height: 600
});
const line: Path2D = rectPath({
x1: 0,
y1: 0,
x2: 300,
y2: 300,
strokeStyle: '#0f2b38',
lineWidth: 15,
}, ctx);
// Do something with Path2D object
console.log(line);
document.body.append($canvas);
The line() implements the following interfaces:
export interface ILine {
x1: number;
y1: number;
x2: number;
y2: number;
}
export interface ILineProps extends ILine, IStrokeProps {}
export const linePath: (props: ILineProps, ctx?: CanvasRenderingContext2D) => Path2D;