# Options

> Every option createChart accepts.

Source: https://82chart.com/en/docs/options/

Everything but `data` is optional. With nothing else you get a line chart in a card, in the document language (Korean if unsupported), following the page theme.

## Type and data

| Option | Default | What it does |
| --- | --- | --- |
| `type` | 'line' | `'line' \| 'area' \| 'bar' \| 'pie' \| 'donut' \| 'scatter' \| 'radar' \| 'gauge' \| 'pyramid' \| 'heatmap' \| 'calendar' \| 'treemap' \| 'funnel' \| 'waterfall'` |
| `data` | (required) | `{ labels?, series }`; see [Data format](https://82chart.com/en/docs/data-format/) |

## Card header

| Option | Default | What it does |
| --- | --- | --- |
| `eyebrow` | - | Small text above the title (shown in capitals) |
| `title` | - | Title; also used in the summary, table caption and file name |
| `subtitle` | - | Grey line under the title |
| `value` | - | Headline figure; numbers get commas, `prefix` and `unit` |
| `delta` | - | Change badge: a number is a percent, a string is shown as is |
| `deltaUpIsGood` | true | Is a rise good? |
| `deltaColors` | 'semantic' | `'semantic'` (good green, bad red) or `'korea'` (up red ▲, down blue ▼) |
| `deltaLabel` | - | Text after the badge, e.g. 'vs last month' |
| `footnote` | - | Small text under the chart, e.g. 'In millions' |
| `description` | - | Read by screen readers before the automatic summary |
| `skin` | 'card' | `'card' \| 'plain' \| 'sparkline'` |

## Size

| Option | Default | What it does |
| --- | --- | --- |
| `width` | parent width | Width (px) used when the parent has no width |
| `height` | per type | Plot height (px) or `'auto'` (width × `aspectRatio`) |
| `aspectRatio` | 0.5625 | Height ÷ width when height is `'auto'` |

## Shape

| Option | Default | What it does |
| --- | --- | --- |
| `horizontal` | false | Horizontal bars |
| `stacked` | false | `true` or `'percent'` (100% stacked) |
| `smooth` | false | Same as `curve: 'smooth'` |
| `curve` | 'straight' | `'straight' \| 'smooth' \| 'step'` |
| `nulls` | 'gap' | `'gap' \| 'connect' \| 'zero'` |
| `points` | 'auto' | Show points (auto: up to 30) |
| `pointShape` | 'circle' | `'circle' \| 'square' \| 'diamond'` |
| `lastPoint` | true for one line | Highlight the last point |
| `barRadius` | 6 | Bar corner radius at the value end (px) |
| `barWidth` | 0.82 / 0.78 | Share of the band a bar group fills |
| `gradient` | true | Soft gradient on bars and areas |
| `stackTotals` | false | Totals above stacked bars |
| `dataLabels` | false | `true \| 'end'`: values at bar and line ends |
| `otherThreshold` | 0.02 | Pie and donut slices below this share fold into "Other" |
| `startAngle` | 0 | Pie and donut start angle (degrees, 0 = top) |
| `donutHole` | 0.62 | Donut hole size (0–1) |
| `donutLabel` | the total | Text in the hole; `false` hides it |
| `pieLabels` | 'inside' | `'inside' \| 'outside' \| 'auto'`: outside labels with leader lines, stacked without overlap ([Pie and donut](https://82chart.com/en/docs/pie-donut/)) |
| `patterns` | 'auto' | Textures on bars, areas, slices, tiles and legend keys (fixed order). `'auto'`: in forced-colors mode and print only ([Accessibility](https://82chart.com/en/docs/accessibility/)) |
| `gauge` | - | `{ min, max, bands: [{ to, color }], label, target, targetLabel }` |
| `pyramid` | - | `{ percent }`: pyramid bars as a share of the whole ([Population pyramid](https://82chart.com/en/docs/pyramid/)) |
| `heatmap` | - | `{ min, max, color, legend, labels, weekStart }`: heatmap and calendar color ramp and key ([Heatmap](https://82chart.com/en/docs/heatmap/)) |
| `colorBy` | 'series' | Treemap: `'series' \| 'change'` (two hues around a gray zero) |
| `treemap` | - | `{ range }`: the change (%) with the strongest color |

## Axes, legend, tooltip

| Option | Default | What it does |
| --- | --- | --- |
| `xAxis / yAxis` | - | `{ title, min, max, format, ticks, step, integer, reverse, grid, type, beginAtZero, labels }`; see below |
| `y2Axis` | - | The right y axis, only when a series has `axis: 'right'`; the same options plus `unit` and `prefix` |
| `legend` | top for 2+ series | `boolean \| 'top' \| 'bottom' \| 'right'` |
| `legendMaxRows` | 2 | Fold top/bottom legend rows past this behind a "+N more" button; 0 never folds |
| `tooltip` | true | `boolean \| { format(value, ctx) }` |

## Numbers and dates

| Option | Default | What it does |
| --- | --- | --- |
| `numberFormat` | 'korean' in Korean, else 'compact' | `'korean' \| 'compact' \| 'comma' \| 'percent' \| (v) => string` |
| `scale` | - | Divide axis ticks by this (1000000 for millions) |
| `unit` | - | Unit after values |
| `prefix` | - | Symbol before values |
| `decimals` | up to 2 | Decimals in tooltips and labels |
| `dateFormat` | 'auto' | Date pattern, e.g. `'MMM D'`, `'YYYY-MM-DD'` |
| `timeZone` | runtime zone | IANA zone for reading and writing dates, e.g. `'Asia/Seoul'` (needed for SSR on UTC servers) |

## Colors and language

| Option | Default | What it does |
| --- | --- | --- |
| `colors` | - | Colors in series order |
| `palette` | 'default' | `'default' \| 'korea' \| 'mono'` |
| `negativeColor` | - | Color of bars below zero |
| `theme` | 'auto' | `'light' \| 'dark' \| 'auto' \| 'krds'` (`'krds'`: KRDS colors, light/dark follows the page) |
| `language` | document lang, else ko | `'ko' \| 'en' \| 'ja' \| 'zh'` (add more with `registerLocale`) |
| `locale` | - | Override some interface strings |

## Features

| Option | Default | What it does |
| --- | --- | --- |
| `animation` | true | First-draw animation (off with reduced motion) |
| `zoom` | false | Zoom and pan |
| `zoomButtons` | true | Zoom in, out and reset buttons with `zoom` (single-pointer alternative) |
| `downsample` | auto above 2,000 | Thin line/area points with LTTB to this many; `false` draws all. CSV and table keep every value |
| `progressive` | 5,000개 넘으면 자동 | Paint big line/area/scatter charts in steps: placeholder, coarse picture, full detail. A number sets the limit; `false` paints at once |
| `annotations` | - | `{ x, y, bands }` |
| `exporting` | true | Download button and ⋯ menu |
| `table` | false | Show the data table |
| `noData` | per language | Message when there is nothing to draw |
| `group` | - | Charts with the same name share the crosshair |
| `loading` | false | Loading placeholder |

## Callbacks and the rest

| Option | Default | What it does |
| --- | --- | --- |
| `onClick` | - | `(point: ChartPoint) => void` |
| `onReady` | - | `(chart) => void`, once after creation |
| `telemetry` | true | Once a day, report the domain and version to 82chart.com (never data); `false` turns it off, `<html data-82chart-telemetry="off">` for the whole page; never on intranet hosts or IPs |
| `framework` | - | Set by the framework wrappers |

## xAxis · yAxis · y2Axis

| Option | Default | What it does |
| --- | --- | --- |
| `title` | - | Axis title |
| `min / max` | auto | Range |
| `format` | numberFormat | Tick text (same values, or a function; a category axis receives the label) |
| `ticks` | auto | Rough tick count (round numbers near it) |
| `grid` | true | Grid lines |
| `type` | auto | x: `'category' \| 'linear' \| 'time'` (numbers are epoch ms on time). Value axes: `'log' \| 'symlog'` |
| `beginAtZero` | true for bars and areas | Start at zero |
| `labels` | true | Draw tick labels |
| `integer` | false | Whole-number ticks only (counts, people) |
| `step` | auto | Fixed tick step, e.g. 10 |
| `reverse` | false | y axis: small values on top (ranks); horizontal bars: reverse the category order |
| `unit / prefix` | - | `y2Axis` only: unit of the right axis and its series |
| `alignZero` | true | `y2Axis` only: both zeros on one grid line when both ranges reach zero |

> The right y axis (`y2Axis`) appears only when a series has `axis: 'right'`. The caveats are on the [combo chart](https://82chart.com/en/docs/combo/) page.