X axis
Bottom X-axis with evenly spaced tick labels (or explicit positions via tickValues). Renders inside ChartRoot.
Primitive:
ChartAxisXInteractive demo
Usage
import { ChartRoot, ChartAxisX } from '@ramtt/charts'
<ChartRoot data={data} height={200}>
<ChartAxisX labelCount={6} format={(i) => months[i]} />
</ChartRoot>Props
| Prop | Type | Default | Description |
|---|---|---|---|
| labelCount | number | 6 | Number of evenly-spaced labels |
| format | (index: number, total: number) => string | — | Label formatter (default: String(index)) |
| tickValues | number[] | — | Explicit data indices for tick positions (overrides labelCount) |
| dy | number | 16 | Vertical offset below chart in px |
| fontFamily | string | 'var(--font-sans)' | SVG <text> font-family |
| animate | AnimateConfig | true | Entry animation |