Scales & Axes
How data maps to positions – auto-inferred, or explicitly configured.
szum infers scale types from your data. Most charts need zero axis configuration.
Auto-inference
| Data values | Inferred scale | Example |
|---|---|---|
| Numbers | linear | 42, 3.14 |
| ISO date strings | utc | "2026-03-15" |
| Other strings | band (categorical) | "Jan", "Organic" |
Axis config
Both x and y accept the same fields:
| Field | Type | Default | Description |
|---|---|---|---|
type | "linear" | "band" | "utc" | auto | Override the inferred scale type. |
domain | [min, max] or string[] | auto | Force a specific range. |
label | string | – | Axis label text. |
tickFormat | string | – | D3 format specifier for tick labels. |
display | boolean | true | Set false to hide the axis. |
Custom domain
Set a specific range for the y-axis:
Tick formatting
Use D3 format specifiers to control how tick labels display. Click a format to see it applied:
$,.0f→$1,200UTC dates
ISO date strings are auto-detected. Tick labels format by granularity:
- Daily data →
Mar 15 - Monthly data →
Mar - Yearly data →
2025
Dates are parsed as UTC. Use ISO 8601 format (YYYY-MM-DD or full datetime).
Automatic behaviors
Zero baseline: For linear scales where all values are positive, the domain starts at 0 – bars always grow from the baseline. Override with an explicit domain.
Tick rotation: When x-axis tick labels would overlap, they rotate -90° automatically. Margins expand to fit.
Tick count: Computed from available space – roughly one tick per 90px on x for date scales, one per 50px for other scales, and one per 2.5× font size on y. For date scales, the count is also capped at the number of data points to avoid synthetic intermediate ticks.