---
url: https://chartbuddy.io/embed/docs/axes.md
---
> Docs index: [llms.txt](https://chartbuddy.io/embed/docs/llms.txt)

# Axes

Axes map categories and values onto the chart. Config covers ticks, bounds, formats, dual scales, and label fit.

Axes are keyed by **physical side** (`left` | `right` | `top` | `bottom`). Each side holds a **role**:

| Role | Meaning |
|---|---|
| `domain` | Categories (or linear X on scatter / mekko width) |
| `primaryRange` | Main value scale |
| `secondaryRange` | Second value scale (dual-axis) |
| `unused` | Placeholder for the side not used by the current orientation |

```js
axes: {
  bottom: { id: 'domain', /* … */ },
  left: { id: 'primaryRange', /* … */ },
  right: { id: 'secondaryRange', enabled: false, boundSeries: [], /* … */ },
  top: { id: 'unused', enabled: false, /* … */ },
}
```

Which role sits on which side depends on [orientation](https://chartbuddy.io/embed/docs/concepts/orientation.md). When orientation changes, the embed moves each role to its new side. Put settings on the side that holds that role *after* the flip (for example, value formats go on `left` when vertical and on `bottom` when horizontal).

| Orientation | Domain | Primary range | Secondary range |
|---|---|---|---|
| `vertical` (default) | bottom | left | right |
| `horizontal` | left | bottom | **top** |

***

## Checklist

Typical order:

1. **Format the value axis** – currency, `%`, decimals ([Number formats](https://chartbuddy.io/embed/docs/configuration/number-formats.md), [Value axis](https://chartbuddy.io/embed/docs/axes/value-axis.md))
2. **Tick density** – leave auto, or set `preferredTickInterval` ([Value axis](https://chartbuddy.io/embed/docs/axes/value-axis.md#preferred-interval))
3. **Bounds** – pin min/max only when you mean it (zero rules, zoom) ([Value axis](https://chartbuddy.io/embed/docs/axes/value-axis.md#bounds))
4. **Gridlines** – usually on the primary range side ([Gridlines](https://chartbuddy.io/embed/docs/configuration/gridlines.md))
5. **Category labels** – wrap / rotate / dates when crowded ([Domain axis](https://chartbuddy.io/embed/docs/axes/domain.md))
6. **Titles** – units on the value axis when the format alone is not enough ([Titles & chrome](https://chartbuddy.io/embed/docs/axes/titles-and-chrome.md))
7. **Dual axis / breaks** – when you need two scales or a collapsed gap ([Secondary](https://chartbuddy.io/embed/docs/axes/secondary.md), [Breaks](https://chartbuddy.io/embed/docs/axes/breaks.md))

***

## Defaults (what you get)

From `getDefaultAxesConfig` (new charts):

* Domain: band scale, `fitMechanism: 'wrap'`, titles **hidden**
* Primary range: linear, `preferredTickInterval: null` (auto sparse ticks), gridlines **off**, titles **hidden**
* Secondary: `enabled: false`, `visible: false`, `boundSeries: []`
* `%` chart types (`stackedBar100`, mekko, …) seed `postfix: '%'` on the relevant labels
* Bar Mekko hides the primary range **axis line** by default (`visible: false`); labels stay available when you turn it on
* Pie / donut: axes disabled

`axes` **deep-merges** on `setChartData` / `update` – see [Defaults & merging](https://chartbuddy.io/embed/docs/concepts/defaults.md). Prefer exporting a full tree from the editor (`getChartData()`) when you need a complete starting point, then patch.

***

## Pages

| Page | Use when |
|---|---|
| [Value axis](https://chartbuddy.io/embed/docs/axes/value-axis.md) | Ticks, bounds, `%` charts, zero rules, currency |
| [Domain axis](https://chartbuddy.io/embed/docs/axes/domain.md) | Category labels, wrap/rotate, dates |
| [Titles & chrome](https://chartbuddy.io/embed/docs/axes/titles-and-chrome.md) | Axis titles, visibility, tick marks, colors |
| [Secondary / dual axis](https://chartbuddy.io/embed/docs/axes/secondary.md) | Second scale + `boundSeries` (incl. horizontal **top**) |
| [Axis breaks](https://chartbuddy.io/embed/docs/axes/breaks.md) | Collapse a dead range on the value axis |
| [By chart type](https://chartbuddy.io/embed/docs/axes/by-chart-type.md) | What each type exposes / fixes / hides |
| [Orientation & roles](https://chartbuddy.io/axes/orientation) | Remap rules and the “0,1,2,3,4” pitfall |

Also: [Gridlines](https://chartbuddy.io/embed/docs/configuration/gridlines.md) · [Number formats](https://chartbuddy.io/embed/docs/configuration/number-formats.md) · [Orientation](https://chartbuddy.io/embed/docs/concepts/orientation.md)

***

## Samples

* [Currency ticks](https://chartbuddy.io/embed/docs/samples/currency-ticks.md) – format + preferred interval + title
* [Dual-axis line](https://chartbuddy.io/embed/docs/samples/dual-axis-line.md) – secondary + `boundSeries`
* [Percent axis](https://chartbuddy.io/embed/docs/samples/percent-axis.md) – pinned 0–100 `%` ticks
* [Horizontal bar](https://chartbuddy.io/embed/docs/samples/horizontal-bar.md) – orientation remap (format the **bottom** range)