color-kitnext

@pbroom/color-kit/planeCompile

toSvgPath

Compiles an ordered list of plane points into an SVG path d string.

functionimport { toSvgPath } from '@pbroom/color-kit/plane';compile.ts:80
function toSvgPath(
  points: PlanePoint[],
  options?: SvgPathCompileOptions,
): string;

Emits M x y for the first point and L x y for each following point, with coordinates multiplied by scale and fixed to precision decimals. Plane y maps directly to SVG y (both grow downward). Returns '' when fewer than two points are given.

Parameters

pointsPlanePoint[]
Ordered points in normalized plane coordinates.
options?SvgPathCompileOptionsdefault {}
Formatting options; see SvgPathCompileOptions.

Returns

stringThe path data string.

Example

TypeScript
import { toSvgPath } from '@pbroom/color-kit/plane';

const points = [
  { x: 0, y: 1 },
  { x: 0.5, y: 0.25 },
  { x: 1, y: 1 },
];
toSvgPath(points); // → 'M 0.000 100.000 L 50.000 25.000 L 100.000 100.000'
toSvgPath(points, { scale: 200, precision: 0, closeLoop: true });
// → 'M 0 200 L 100 50 L 200 200 Z'

See also

toSvgCompoundPath for several paths at once.

Also exported from