Chart root

Cartesian SVG container — supplies scales, dimensions, and ResizeObserver-driven width to all child primitives via context.

Primitive: ChartRoot· Standalone (no ChartRoot needed)

Interactive demo

Usage

import { ChartRoot, ChartLine, ChartAxisX, ChartAxisY } from '@ramtt/charts'

<ChartRoot data={data} height={200}>
  <ChartLine />
  <ChartAxisX />
  <ChartAxisY />
</ChartRoot>

Props

Prop	Type	Default	Description
data*	`readonly number[]`	—	Primary series — drives scaleY domain
height	`number`	280	SVG height in px (width from container)
padding	`Partial<ChartPadding>`	—	Override per-edge padding
yPadding	`number`	0.05	Extra Y-domain padding fraction
yDomain	`readonly [number, number]`	—	Override Y domain
xDomain	`readonly [number, number]`	—	Override X domain (use [-0.5, N-0.5] for band positioning)
decimationFactor	`number`	0.3	Downsampling target multiplier (lower = smoother)
children	`ReactNode`	—	Chart primitives