@types/d3-shape

Line Generation

Generates a SVG path data string for a line connecting a series of points.

import * as d3 from 'd3-shape';

const line = d3.line()
    .x((d) => d.x)
    .y((d) => d.y);
const points = [{ x: 0, y: 0 }, { x: 10, y: 10 }];
const pathData = line(points);

Area Generation

Creates an area defined by a line along its top edge and a baseline along the bottom.

import * as d3 from 'd3-shape';

const area = d3.area()
    .x((d) => d.x)
    .y0(0)
    .y1((d) => d.y);
const points = [{ x: 0, y: 0 }, { x: 10, y: 10 }];
const pathData = area(points);

Pie Chart Generation

Generates pie chart sectors, calculating the start and end angles for each data point.

import * as d3 from 'd3-shape';

const pie = d3.pie()
    .value((d) => d.value);
const data = [{ value: 10 }, { value: 20 }];
const arcs = pie(data);