PathBuilder • tldraw Docs

Table of contents

Methods
- cubicSplineThroughPoints
- lineThroughPoints
- arcTo
- circularArcTo
- close
- cubicBezierTo
- lineTo
- moveTo
- toD
- toDrawD
- toGeometry
- toPath2D
- toSvg

class PathBuilder {}

Constructor

Constructs a new instance of the PathBuilder class

Methods

cubicSplineThroughPoints( )

static

static cubicSplineThroughPoints(
  points: VecLike[],
  opts?: PathBuilderLineOpts & {
    endOffsets?: number;
  },
): PathBuilder;

Parameters

Name	Description
`points`	`VecLike[];`
`opts`	`PathBuilderLineOpts & { endOffsets?: number; };`

Returns

PathBuilder;

lineThroughPoints( )

static

static lineThroughPoints(
  points: VecLike[],
  opts?: PathBuilderLineOpts & {
    endOffsets?: number;
  },
): PathBuilder;

Parameters

Name	Description
`points`	`VecLike[];`
`opts`	`PathBuilderLineOpts & { endOffsets?: number; };`

Returns

PathBuilder;

arcTo( )

arcTo(
  rx: number,
  ry: number,
  largeArcFlag: boolean,
  sweepFlag: boolean,
  xAxisRotationRadians: number,
  x2: number,
  y2: number,
  opts?: PathBuilderCommandOpts,
): this;

Parameters

Name	Description
`rx`	`number;`
`ry`	`number;`
`largeArcFlag`	`boolean;`
`sweepFlag`	`boolean;`
`xAxisRotationRadians`	`number;`
`x2`	`number;`
`y2`	`number;`
`opts`	`PathBuilderCommandOpts;`

Returns

this;

circularArcTo( )

circularArcTo(
  radius: number,
  largeArcFlag: boolean,
  sweepFlag: boolean,
  x2: number,
  y2: number,
  opts?: PathBuilderCommandOpts,
): this;

Parameters

Name	Description
`radius`	`number;`
`largeArcFlag`	`boolean;`
`sweepFlag`	`boolean;`
`x2`	`number;`
`y2`	`number;`
`opts`	`PathBuilderCommandOpts;`

Returns

this;

close( )

close(): this;

cubicBezierTo( )

cubicBezierTo(
  x: number,
  y: number,
  cp1X: number,
  cp1Y: number,
  cp2X: number,
  cp2Y: number,
  opts?: PathBuilderCommandOpts,
): this;

Parameters

Name	Description
`x`	`number;`
`y`	`number;`
`cp1X`	`number;`
`cp1Y`	`number;`
`cp2X`	`number;`
`cp2Y`	`number;`
`opts`	`PathBuilderCommandOpts;`

Returns

this;

lineTo( )

lineTo(x: number, y: number, opts?: PathBuilderCommandOpts): this;

Parameters

Name	Description
`x`	`number;`
`y`	`number;`
`opts`	`PathBuilderCommandOpts;`

Returns

this;

moveTo( )

moveTo(x: number, y: number, opts?: PathBuilderLineOpts): this;

Parameters

Name	Description
`x`	`number;`
`y`	`number;`
`opts`	`PathBuilderLineOpts;`

Returns

this;

toD( )

toD(opts?: PathBuilderToDOpts): string;

Parameters

Name	Description
`opts`	`PathBuilderToDOpts;`

Returns

string;

toDrawD( )

toDrawD(opts: DrawPathBuilderDOpts): string;

Parameters

Name	Description
`opts`	`DrawPathBuilderDOpts;`

Returns

string;

toGeometry( )

toGeometry(): Group2d | PathBuilderGeometry2d;

toPath2D( )

toPath2D(opts: PathBuilderOpts): Path2D;

Parameters

Name	Description
`opts`	`PathBuilderOpts;`

Returns

Path2D;

toSvg( )

toSvg(opts: PathBuilderOpts): import("react/jsx-runtime").JSX.Element;

Parameters

Name	Description
`opts`	`PathBuilderOpts;`

Returns

import("react/jsx-runtime").JSX.Element;