path2polygon

Transforms a path string into an Array of points, with no DOM involved. Straight segments contribute their endpoints; curves and arcs are flattened into line segments no longer than segmentLength. Higher segmentLength values lower computation time but yield more rigid curves.

Basic example

Turns an SVG path string into an array of [x, y] points without touching the DOM: straight segments contribute their endpoints and curves are flattened into straight pieces no longer than segmentLength (50 by default). The grey curve is the path, the blue polyline its polygon.

import {path2polygon} from "@d3plus/math";

path2polygon("M 20 150 C 80 20, 160 20, 240 150");

Segment length

A shorter segmentLength follows the curve closely at the cost of more points; a longer one is faster but more angular. Shapes use the polygon for hit-testing and for fitting labels with largestRect.

import {path2polygon} from "@d3plus/math";

path2polygon("M 20 150 C 80 20, 160 20, 240 150", 10);

Parameters

import {path2polygon} from "@d3plus/math";

pathrequiredstring

An SVG string path, commonly the "d" property of a <path> element.

segmentLengthnumberDefault 50

The maximum length of line segments when flattening curves.