Variable: layoutSchema
ts
const layoutSchema: ObjectNode<{
autosize: Attr<boolean, {
description: "Size the figure to its container on first render (and on resize with `config.responsive`).";
dflt: false;
editType: "layout";
}>;
colorway: AttrSpec<readonly string[], string[]>;
datarevision: AttrSpec<unknown, unknown>;
dragmode: Attr<
| false
| "zoom"
| "pan"
| "select"
| "lasso"
| "drawclosedpath"
| "drawopenpath"
| "drawline"
| "drawrect"
| "drawcircle"
| "orbit"
| "turntable", {
description: "What dragging on the plot area does: zoom, pan, box or lasso select, or draw a new shape (`draw*`, styled by `newshape`).";
dflt: "zoom";
editType: "modebar";
values: readonly ["zoom", "pan", "select", "lasso", "drawclosedpath", "drawopenpath", "drawline", "drawrect", "drawcircle", "orbit", "turntable", false];
}>;
font: ObjectNode<{
color: Attr<string, {
description: "Base text color.";
dflt: "#444";
editType: "style";
}>;
family: Attr<string, {
description: "CSS font-family list used by every text element unless overridden.";
dflt: "\"Open Sans\", verdana, arial, sans-serif";
noBlank: true;
strict: true;
}>;
lineposition: Attr<
| "under"
| "over"
| "through"
| "none"
| `under+${string}`
| `over+${string}`
| `through+${string}`, {
description: "Text decoration: `under`, `over` and/or `through` joined with `+` (e.g. `under+over`), or `none`.";
dflt: "none";
extras: readonly ["none"];
flags: readonly ["under", "over", "through"];
}>;
shadow: Attr<string, {
description: "CSS `text-shadow` behind the text (`2px 2px 3px black`; only the first shadow is drawn), `none`, or `auto` for a thin halo in the contrast color of the text.";
dflt: "none";
}>;
size: Attr<number, {
description: "Base font size in CSS pixels.";
dflt: 12;
min: 1;
}>;
style: Attr<"normal" | "italic", {
description: "Base font style.";
dflt: "normal";
values: readonly ["normal", "italic"];
}>;
textcase: Attr<"normal" | "word caps" | "upper" | "lower", {
description: "Letter case transform: `upper`, `lower`, `word caps` (first letter of each word), or `normal`.";
dflt: "normal";
values: readonly ["normal", "word caps", "upper", "lower"];
}>;
variant: Attr<
| "normal"
| "small-caps"
| "all-small-caps"
| "all-petite-caps"
| "petite-caps"
| "unicase", {
description: "Capitals variant (CSS `font-variant-caps`). The SDF text renderer approximates small and petite caps with uppercase letters at a reduced size.";
dflt: "normal";
values: readonly ["normal", "small-caps", "all-small-caps", "all-petite-caps", "petite-caps", "unicase"];
}>;
weight: Attr<number | "normal" | "bold", {
description: "Base font weight.";
dflt: "normal";
extras: readonly ["normal", "bold"];
max: 1000;
min: 1;
}>;
}>;
grid: ObjectNode<{
columns: Attr<number, {
description: "Number of columns. Defaults to the length of `subplots[0]` or `xaxes`.";
max: 100;
min: 1;
}>;
domain: ObjectNode<{
x: AttrSpec<[number, number], [number, number]>;
y: AttrSpec<[number, number], [number, number]>;
}>;
pattern: Attr<"independent" | "coupled", {
description: "Default cell contents when neither `subplots` nor `xaxes`/`yaxes` is given: `coupled` shares one x axis per column and one y axis per row (`xaxes: ['x', 'x2', …]`, `yaxes: ['y', 'y2', …]`); `independent` gives every cell its own pair (`'xy'`, `'x2y2'`, … in row-major order).";
dflt: "coupled";
values: readonly ["independent", "coupled"];
}>;
roworder: Attr<"top to bottom" | "bottom to top", {
description: "Whether row 0 (of `subplots`, `yaxes` and trace `domain.row`) is the top row or the bottom row.";
dflt: "top to bottom";
values: readonly ["top to bottom", "bottom to top"];
}>;
rows: Attr<number, {
description: "Number of rows. Defaults to the length of `subplots` or `yaxes`. A grid needs more than one cell (`rows * columns > 1`); otherwise it is ignored.";
max: 100;
min: 1;
}>;
subplots: AttrSpec<string[][], string[][] | undefined>;
xaxes: AttrSpec<string[], string[] | undefined>;
xgap: Attr<number, {
description: "Horizontal space between columns, as a fraction of a column width. Defaults to 0.2 for a grid of independent subplots (`subplots` or `pattern: independent`), 0.1 otherwise.";
max: 1;
min: 0;
}>;
xside: Attr<"top" | "bottom" | "bottom plot" | "top plot", {
description: "Where the x axes are drawn by default: `bottom plot` / `top plot` against the bottom-most / top-most subplot of their column; `bottom` / `top` at the bottom / top edge of the grid (`anchor: 'free'`), even when that cell is empty.";
dflt: "bottom plot";
values: readonly ["bottom", "bottom plot", "top plot", "top"];
}>;
yaxes: AttrSpec<string[], string[] | undefined>;
ygap: Attr<number, {
description: "Vertical space between rows, as a fraction of a row height. Defaults to 0.3 for a grid of independent subplots (`subplots` or `pattern: independent`), 0.1 otherwise.";
max: 1;
min: 0;
}>;
yside: Attr<"left" | "right" | "left plot" | "right plot", {
description: "Where the y axes are drawn by default: `left plot` / `right plot` against the left-most / right-most subplot of their row; `left` / `right` at the left / right edge of the grid (`anchor: 'free'`), even when that cell is empty.";
dflt: "left plot";
values: readonly ["left", "left plot", "right plot", "right"];
}>;
}>;
height: Attr<number, {
description: "Figure height in CSS pixels. Ignored when `autosize` fills the container.";
dflt: 450;
editType: "layout";
min: 10;
}>;
hovermode: Attr<false | "x" | "y" | "closest" | "x unified" | "y unified", {
description: "How hover picks points: nearest point, all points at the same x/y, or unified labels.";
dflt: "closest";
editType: "modebar";
values: readonly ["x", "y", "closest", false, "x unified", "y unified"];
}>;
margin: ObjectNode<{
autoexpand: Attr<boolean, {
description: "Let components (legend, colorbars, automargin axes) grow the margins.";
dflt: true;
}>;
b: Attr<number, {
description: "Bottom margin in CSS pixels.";
dflt: 80;
min: 0;
}>;
gutter: Attr<number, {
description: "Holochart extension: space (CSS px) kept between the figure edge and content that grows a margin (automargin tick labels and axis titles, legends, colorbars), so it never touches the edge. 0 (Plotly) lets that content reach the edge.";
dflt: 0;
min: 0;
}>;
l: Attr<number, {
description: "Left margin in CSS pixels.";
dflt: 80;
min: 0;
}>;
pad: Attr<number, {
description: "Padding between the plot area and the axis lines, in CSS pixels.";
dflt: 0;
min: 0;
}>;
r: Attr<number, {
description: "Right margin in CSS pixels.";
dflt: 80;
min: 0;
}>;
t: Attr<number, {
description: "Top margin in CSS pixels.";
dflt: 100;
min: 0;
}>;
}>;
meta: AttrSpec<unknown, unknown>;
paper_bgcolor: Attr<string, {
description: "Background color of the whole figure.";
dflt: "#fff";
editType: "style";
}>;
plot_bgcolor: Attr<string, {
description: "Background color of the plot area between the axes.";
dflt: "#fff";
editType: "style";
}>;
selections: ItemsNode<object & TemplatedItemChildren>;
separators: Attr<string, {
description: "Decimal then thousands separator of numbers, e.g. `', '` for `1 234,5`. Default: the locale's (`config.locale`), `'.,'` in English.";
editType: "plot";
noBlank: true;
}>;
showlegend: Attr<boolean, {
description: "Show the legend. Defaults to `true` when more than one trace has a legend entry.";
editType: readonly ["legend", "layout"];
}>;
template: AttrSpec<unknown, unknown>;
title: ObjectNode<{
font: ObjectNode<{
color: Attr<string, {
description: "Text color.";
editType: "style";
}>;
family: Attr<string, {
description: "CSS font-family list. The renderer uses the first family it can load and falls back through the list.";
noBlank: true;
strict: true;
}>;
lineposition: Attr<
| "under"
| "over"
| "through"
| "none"
| `under+${string}`
| `over+${string}`
| `through+${string}`, {
description: "Text decoration: `under`, `over` and/or `through` joined with `+` (e.g. `under+over`), or `none`.";
extras: readonly ["none"];
flags: readonly ["under", "over", "through"];
}>;
shadow: Attr<string, {
description: "CSS `text-shadow` behind the text (`2px 2px 3px black`; only the first shadow is drawn), `none`, or `auto` for a thin halo in the contrast color of the text.";
}>;
size: Attr<number, {
description: "Font size in CSS pixels.";
min: 1;
}>;
style: Attr<"normal" | "italic", {
description: "Font style.";
values: readonly ["normal", "italic"];
}>;
textcase: Attr<"normal" | "word caps" | "upper" | "lower", {
description: "Letter case transform: `upper`, `lower`, `word caps` (first letter of each word), or `normal`.";
values: readonly ["normal", "word caps", "upper", "lower"];
}>;
variant: Attr<
| "normal"
| "small-caps"
| "all-small-caps"
| "all-petite-caps"
| "petite-caps"
| "unicase", {
description: "Capitals variant (CSS `font-variant-caps`). The SDF text renderer approximates small and petite caps with uppercase letters at a reduced size.";
values: readonly ["normal", "small-caps", "all-small-caps", "all-petite-caps", "petite-caps", "unicase"];
}>;
weight: Attr<number | "normal" | "bold", {
description: "Font weight: a CSS numeric weight (1–1000), `normal` or `bold`.";
extras: readonly ["normal", "bold"];
max: 1000;
min: 1;
}>;
}>;
text: Attr<string, {
description: "Title text (supports rich-text tags, E2.10).";
dflt: "";
}>;
x: Attr<number, {
description: "Horizontal position in `xref` coordinates.";
dflt: 0.5;
max: 1;
min: 0;
}>;
xanchor: Attr<"auto" | "left" | "center" | "right", {
description: "Horizontal alignment of the title box relative to `x`.";
dflt: "auto";
values: readonly ["auto", "left", "center", "right"];
}>;
xref: Attr<"container" | "paper", {
description: "`container` spans the whole figure; `paper` spans the plot area.";
dflt: "container";
values: readonly ["container", "paper"];
}>;
y: Attr<number | "auto", {
description: "Vertical position in `yref` coordinates. `auto` places it in the top margin.";
dflt: "auto";
extras: readonly ["auto"];
max: 1;
min: 0;
}>;
yanchor: Attr<"auto" | "top" | "middle" | "bottom", {
description: "Vertical alignment of the title box relative to `y`.";
dflt: "auto";
values: readonly ["auto", "top", "middle", "bottom"];
}>;
yref: Attr<"container" | "paper", {
description: "`container` spans the whole figure; `paper` spans the plot area.";
dflt: "container";
values: readonly ["container", "paper"];
}>;
}>;
transition: ObjectNode<{
duration: Attr<number, {
description: "Transition duration in milliseconds.";
dflt: 500;
min: 0;
}>;
easing: Attr<
| "linear"
| "quad"
| "cubic"
| "sin"
| "exp"
| "circle"
| "elastic"
| "back"
| "bounce"
| "linear-in"
| "quad-in"
| "cubic-in"
| "sin-in"
| "exp-in"
| "circle-in"
| "elastic-in"
| "back-in"
| "bounce-in"
| "linear-out"
| "quad-out"
| "cubic-out"
| "sin-out"
| "exp-out"
| "circle-out"
| "elastic-out"
| "back-out"
| "bounce-out"
| "linear-in-out"
| "quad-in-out"
| "cubic-in-out"
| "sin-in-out"
| "exp-in-out"
| "circle-in-out"
| "elastic-in-out"
| "back-in-out"
| "bounce-in-out", {
description: "Easing function.";
dflt: "cubic-in-out";
values: readonly ["linear", "quad", "cubic", "sin", "exp", "circle", "elastic", "back", "bounce", "linear-in", "quad-in", "cubic-in", "sin-in", "exp-in", "circle-in", "elastic-in", "back-in", "bounce-in", "linear-out", "quad-out", "cubic-out", "sin-out", "exp-out", "circle-out", "elastic-out", "back-out", "bounce-out", "linear-in-out", "quad-in-out", "cubic-in-out", "sin-in-out", "exp-in-out", "circle-in-out", "elastic-in-out", "back-in-out", "bounce-in-out"];
}>;
ordering: Attr<"layout first" | "traces first", {
description: "Whether layout or trace changes animate first.";
dflt: "layout first";
values: readonly ["layout first", "traces first"];
}>;
}>;
uirevision: AttrSpec<unknown, unknown>;
uniformtext: ObjectNode<{
minsize: Attr<number, {
description: "Minimum text size in px for `uniformtext.mode`. Also raises trace fonts smaller than it.";
dflt: 0;
min: 0;
}>;
mode: Attr<false | "hide" | "show", {
description: "Uniform size for the text inside bars and pie slices, per trace type (E4.6): labels are drawn at the smallest fitted size; `hide` drops labels that would be smaller than `minsize`, `show` draws them at the uniform size. `false` lets every label scale on its own.";
dflt: false;
values: readonly [false, "hide", "show"];
}>;
}>;
width: Attr<number, {
description: "Figure width in CSS pixels. Ignored when `autosize` fills the container.";
dflt: 700;
editType: "layout";
min: 10;
}>;
xaxis: ObjectNode<{
anchor: Attr<"y" | `y${number}` | "free", {
description: "The y axis this axis is drawn against, or `free`. Defaults to the y axis of the first subplot using this axis.";
dflt: "y";
editType: "layout";
extras: readonly ["free"];
}>;
automargin: Attr<
| boolean
| "left"
| "right"
| "top"
| "bottom"
| "height"
| "width"
| `left+${string}`
| `right+${string}`
| `top+${string}`
| `bottom+${string}`
| `height+${string}`
| `width+${string}`, {
description: "Grow the figure margins so tick labels and the title fit (E4.2). `true` allows every direction; flags restrict it.";
dflt: false;
editType: EditType;
extras: readonly [true, false];
flags: readonly ["height", "width", "left", "right", "top", "bottom"];
}>;
autorange: Attr<boolean | "reversed" | "min reversed" | "max reversed" | "min" | "max", {
description: "Whether the range is computed from the data. `reversed` autoranges with the axis flipped. `min`/`max` autorange only that end and take the other from `range` (`min reversed`/`max reversed` also flip the axis). Defaults to `false` when a full `range` is given, to `min`/`max` when one end of `range` is `null`, and to `reversed` on a y axis only `image` traces use (row 0 at the top, as in Plotly).";
dflt: true;
editType: EditType;
values: readonly [true, false, "reversed", "min reversed", "max reversed", "min", "max"];
}>;
autorangeoptions: ObjectNode<{
clipmax: AttrSpec<unknown, unknown>;
clipmin: AttrSpec<unknown, unknown>;
include: AttrSpec<unknown, unknown>;
maxallowed: AttrSpec<unknown, unknown>;
minallowed: AttrSpec<unknown, unknown>;
}>;
autoshift: Attr<boolean, {
description: "y axes with `anchor: 'free'` only: move the axis sideways so it does not overlap other free axes on the same side (and default `position` to the overlaid plot's edge, `automargin` to `true`, `shift` to ∓3 px). Plotly semantics.";
editType: EditType;
}>;
autotickangles: AttrSpec<number[], number[]>;
autotypenumbers: Attr<"convert types" | "strict", {
description: "How type detection treats numeric strings: `convert types` counts `'12'` as a number; `strict` counts only real numbers, so numeric strings make a `category` axis.";
dflt: "convert types";
editType: "calc";
values: readonly ["convert types", "strict"];
}>;
categoryarray: AttrSpec<DataArray, DataArray | undefined>;
categoryorder: Attr<
| "array"
| "trace"
| "category ascending"
| "category descending"
| "total ascending"
| "total descending"
| "min ascending"
| "min descending"
| "max ascending"
| "max descending"
| "sum ascending"
| "sum descending"
| "mean ascending"
| "mean descending"
| "median ascending"
| "median descending", {
description: "Order of categories: as they first appear in the traces (`trace`), alphabetical/numerical (`category ascending|descending`), `categoryarray` first (`array`), or by an aggregate of the trace values per category (`total`, `min`, `max`, `sum`, `mean`, `median`). Defaults to `array` when `categoryarray` is set, else `trace`.";
editType: "calc";
values: readonly ["trace", "category ascending", "category descending", "array", "total ascending", "total descending", "min ascending", "min descending", "max ascending", "max descending", "sum ascending", "sum descending", "mean ascending", "mean descending", "median ascending", "median descending"];
}>;
color: Attr<string, {
description: "Base color of the axis: the default for `linecolor`, `tickcolor`, `zerolinecolor`, `dividercolor` and (when changed) the tick-label and title font colors.";
dflt: "#444";
editType: "ticks";
}>;
constrain: Attr<"range" | "domain", {
description: "How a `scaleanchor` / `matches` constraint is met on this axis: `range` widens the range, `domain` shrinks the axis (and its subplot) inside its `domain`. Default `domain` on the axes of `image` traces (Plotly).";
dflt: "range";
editType: EditType;
values: readonly ["range", "domain"];
}>;
constraintoward: Attr<"left" | "center" | "right" | "top" | "middle" | "bottom", {
description: "Which end stays put when a constraint changes the range or domain: `left`/`center`/`right` for x axes (default `center`), `bottom`/`middle`/`top` for y axes (default `middle`).";
editType: EditType;
values: readonly ["left", "center", "right", "top", "middle", "bottom"];
}>;
dividercolor: Attr<string, {
description: "Multicategory divider color. Defaults to `color`.";
editType: "ticks";
}>;
dividerwidth: Attr<number, {
description: "Multicategory divider width in px.";
dflt: 1;
editType: "ticks";
min: 0;
}>;
domain: AttrSpec<[number, number], [number, number]>;
dtick: AttrSpec<unknown, unknown>;
exponentformat: Attr<"none" | "e" | "E" | "power" | "SI" | "B", {
description: "How large and small numbers are written: `none` (1000000), `e` (1e+6), `E` (1E+6), `power` (1×10⁶), `SI` (1M), `B` (like SI but 1B for 10⁹).";
dflt: "B";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
values: readonly ["none", "e", "E", "power", "SI", "B"];
}>;
fixedrange: Attr<boolean, {
description: "Disables zoom and pan on this axis (drag, scroll, and modebar zoom leave its range alone).";
dflt: false;
editType: "none";
}>;
gridcolor: Attr<string, {
description: "Grid line color.";
dflt: "#eee";
editType: "ticks";
}>;
griddash: Attr<string, {
description: "Dash style: `solid`, `dot`, `dash`, `longdash`, `dashdot`, `longdashdot`, or a CSS-like list of dash lengths in px (`5px,10px,2px,2px`).";
dflt: "solid";
editType: "ticks";
}>;
gridwidth: Attr<number, {
description: "Grid line width in px.";
dflt: 1;
editType: "ticks";
min: 0;
}>;
hoverformat: Attr<string, {
description: "Format of this axis’ values in hover labels (same syntax as `tickformat`). Empty uses the tick format with extra precision.";
dflt: "";
editType: "none";
}>;
layer: Attr<"above traces" | "below traces", {
description: "Draw the axis line, ticks and labels above or below the traces. Grid lines are always below.";
dflt: "above traces";
editType: "plot";
values: readonly ["above traces", "below traces"];
}>;
linecolor: Attr<string, {
description: "Axis line color. Defaults to `color`.";
editType: "ticks";
}>;
linewidth: Attr<number, {
description: "Axis line width in px.";
dflt: 1;
editType: "ticks";
min: 0;
}>;
matches: Attr<string, {
description: "Link this axis' range to another axis of the same type (`'x'`, `'x2'`, `'y'`, …): they autorange together over all their data, and zoom, pan and `relayout` of one move all. The linked axes share `range`, `autorange`, `rangemode`, `rangebreaks`, `constrain` and the category order. An axis that would create a loop, or a target of another type, is ignored.";
editType: "calc";
noBlank: true;
strict: true;
}>;
maxallowed: AttrSpec<unknown, unknown>;
minallowed: AttrSpec<unknown, unknown>;
minexponent: Attr<number, {
description: "Smallest decimal exponent written in exponent form (`SI`/`B` and exponent formats); smaller magnitudes are written out in full.";
dflt: 3;
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
min: 0;
}>;
minor: ObjectNode<{
dtick: AttrSpec<unknown, unknown>;
gridcolor: Attr<string, {
description: "Minor grid color. Defaults to `gridcolor` blended halfway to the plot background.";
}>;
griddash: Attr<string, {
description: "Minor grid dash style. Defaults to `griddash`. Dash style: `solid`, `dot`, `dash`, `longdash`, `dashdot`, `longdashdot`, or a CSS-like list of dash lengths in px (`5px,10px,2px,2px`).";
}>;
gridwidth: Attr<number, {
description: "Minor grid width in px. Defaults to `gridwidth`.";
min: 0;
}>;
nticks: Attr<number, {
description: "Maximum number of minor ticks per major interval for `tickmode: auto` (0 picks it from the axis length).";
dflt: 5;
min: 0;
}>;
showgrid: Attr<boolean, {
description: "Draw minor grid lines.";
dflt: false;
}>;
tick0: AttrSpec<unknown, unknown>;
tickcolor: Attr<string, {
description: "Minor tick color. Defaults to `tickcolor`.";
}>;
ticklen: Attr<number, {
description: "Minor tick length in px. Defaults to 60% of `ticklen`.";
min: 0;
}>;
tickmode: Attr<"auto" | "linear" | "array", {
description: "As the major `tickmode`. Defaults to `array` when `minor.tickvals` is set, `linear` when `minor.dtick` is set, else `auto`.";
values: readonly ["auto", "linear", "array"];
}>;
ticks: Attr<"" | "outside" | "inside", {
description: "Draw minor tick marks outside or inside the plot area, or not at all.";
dflt: "";
values: readonly ["outside", "inside", ""];
}>;
tickvals: AttrSpec<DataArray, DataArray | undefined>;
tickwidth: Attr<number, {
description: "Minor tick width in px. Defaults to `tickwidth`.";
min: 0;
}>;
}>;
minorloglabels: Attr<"none" | "small digits" | "complete", {
description: "Log axes whose automatic ticks fall between powers of ten (2, 5 or every digit): `small digits` labels them with a small digit (2, 5), `complete` with the full value in the tick font, with `tickprefix`/`ticksuffix` (20, 50, 200), `none` leaves them unlabelled.";
dflt: "small digits";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
values: readonly ["small digits", "complete", "none"];
}>;
mirror: Attr<boolean | "all" | "ticks" | "allticks", {
description: "Repeat the axis line on the opposite side of the plot area: `true` (line), `ticks` (line and ticks); `all`/`allticks` do the same on every subplot sharing this axis.";
dflt: false;
editType: EditType;
values: readonly [true, "ticks", false, "all", "allticks"];
}>;
nticks: Attr<number, {
description: "Maximum number of ticks for `tickmode: auto` (the actual number may be lower so steps stay round). 0 picks it from the axis length.";
dflt: 0;
editType: "ticks";
min: 0;
}>;
overlaying: AttrSpec<"x" | "free" | `x${number}`, "x" | "free" | `x${number}` | undefined>;
position: Attr<number, {
description: "Position of the axis in paper coordinates (0–1 across the y direction). Only used when `anchor` is `free`.";
dflt: 0;
editType: EditType;
max: 1;
min: 0;
}>;
range: AttrSpec<[unknown, unknown], [unknown, unknown] | undefined>;
rangebreaks: ItemsNode<object & TemplatedItemChildren>;
rangemode: Attr<"normal" | "tozero" | "nonnegative", {
description: "Linear axes only. `tozero` extends the autorange to include 0; `nonnegative` keeps it ≥ 0.";
dflt: "normal";
editType: EditType;
values: readonly ["normal", "tozero", "nonnegative"];
}>;
rangeselector: ObjectNode<{
activecolor: Attr<string, {
description: "Background of the active button (the one whose range is in view) and of hovered buttons. Defaults to `bgcolor` darkened (light colors) or lightened (dark colors).";
}>;
bgcolor: Attr<string, {
description: "Background of the buttons.";
dflt: "#eee";
}>;
bordercolor: Attr<string, {
description: "Border color of the buttons.";
dflt: "#444";
}>;
borderwidth: Attr<number, {
description: "Border width of the buttons, px.";
dflt: 0;
min: 0;
}>;
buttons: ItemsNode<object & TemplatedItemChildren>;
font: ObjectNode<{
color: Attr<string, {
description: "Text color.";
}>;
family: Attr<string, {
description: "CSS font-family list. The renderer uses the first family it can load and falls back through the list.";
noBlank: true;
strict: true;
}>;
lineposition: Attr<
| "under"
| "over"
| "through"
| "none"
| `under+${(...)}`
| `over+${(...)}`
| `through+${(...)}`, {
description: "Text decoration: `under`, `over` and/or `through` joined with `+` (e.g. `under+over`), or `none`.";
extras: readonly [...];
flags: readonly [..., ..., ...];
}>;
shadow: Attr<string, {
description: "CSS `text-shadow` behind the text (`2px 2px 3px black`; only the first shadow is drawn), `none`, or `auto` for a thin halo in the contrast color of the text.";
}>;
size: Attr<number, {
description: "Font size in CSS pixels.";
min: 1;
}>;
style: Attr<"normal" | "italic", {
description: "Font style.";
values: readonly [..., ...];
}>;
textcase: Attr<"normal" | "word caps" | "upper" | "lower", {
description: "Letter case transform: `upper`, `lower`, `word caps` (first letter of each word), or `normal`.";
values: readonly [..., ..., ..., ...];
}>;
variant: Attr<
| "normal"
| "small-caps"
| "all-small-caps"
| "all-petite-caps"
| "petite-caps"
| "unicase", {
description: "Capitals variant (CSS `font-variant-caps`). The SDF text renderer approximates small and petite caps with uppercase letters at a reduced size.";
values: readonly [..., ..., ..., ..., ..., ...];
}>;
weight: Attr<number | "normal" | "bold", {
description: "Font weight: a CSS numeric weight (1–1000), `normal` or `bold`.";
extras: readonly [..., ...];
max: 1000;
min: 1;
}>;
}>;
visible: Attr<boolean, {
description: "Show the range selector. Defaults to `true` when it has `buttons`.";
}>;
x: Attr<number, {
description: "Horizontal position in paper coordinates (fractions of the plot area width). Defaults to the start of the axis domain. Give `x` and `y` together; one alone is ignored.";
max: 3;
min: -2;
}>;
xanchor: Attr<"auto" | "left" | "center" | "right", {
description: "Which side of the button row `x` refers to.";
dflt: "left";
values: readonly ["auto", "left", "center", "right"];
}>;
y: Attr<number, {
description: "Vertical position in paper coordinates. Defaults to just above the highest subplot on this x axis.";
max: 3;
min: -2;
}>;
yanchor: Attr<"auto" | "top" | "middle" | "bottom", {
description: "Which side of the button row `y` refers to.";
dflt: "bottom";
values: readonly ["auto", "top", "middle", "bottom"];
}>;
}>;
rangeslider: ObjectNode<{
autorange: Attr<boolean, {
description: "Span every data point of the axis (its autorange, whatever the axis range in view). Defaults to `true` unless a full `range` is given.";
}>;
bgcolor: Attr<string, {
description: "Background of the slider. Defaults to `plot_bgcolor`.";
}>;
bordercolor: Attr<string, {
description: "Border color of the slider.";
dflt: "#444";
}>;
borderwidth: Attr<number, {
description: "Border width of the slider, px.";
dflt: 0;
min: 0;
}>;
range: AttrSpec<[unknown, unknown], [unknown, unknown] | undefined>;
thickness: Attr<number, {
description: "Height of the slider as a fraction of the figure height minus `margin.t` and `margin.b`. The bottom margin grows to make room for it.";
dflt: 0.15;
max: 1;
min: 0;
}>;
visible: Attr<boolean, {
description: "Show the range slider. Defaults to `true` when `rangeslider` is given (`rangeslider: {}` is enough) or the axis has an `ohlc` or `candlestick` trace, else `false`.";
}>;
yaxis: ObjectNode<{
range: AttrSpec<[unknown, unknown], [..., ...] | undefined>;
rangemode: Attr<"auto" | "fixed" | "match", {
description: "The y range of this subplot's thumbnail: `match` follows the y axis range in view, `auto` spans all the y data (autorange), `fixed` uses `range`. Defaults to `fixed` with a valid `range`, else `match`.";
values: readonly [..., ..., ...];
}>;
}>;
}>;
scaleanchor: AttrSpec<unknown, unknown>;
scaleratio: Attr<number, {
description: "With `scaleanchor`: px per unit of this axis divided by px per unit of the anchor axis (2 makes one unit here twice as long).";
dflt: 1;
editType: EditType;
min: 0;
}>;
separatethousands: Attr<boolean, {
description: "Always separate thousands (1,000). By default only numbers with 5 or more integer digits are separated.";
dflt: false;
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
shift: Attr<number, {
description: "y axes with `anchor: 'free'` only: extra horizontal offset in px (negative to the left). Defaults to -3 on the left and 3 on the right when `autoshift` is on, else 0.";
editType: EditType;
}>;
showdividers: Attr<boolean, {
description: "Multicategory axes: draw divider lines between groups.";
dflt: true;
editType: "ticks";
}>;
showexponent: Attr<"none" | "all" | "first" | "last", {
description: "Which tick labels show the exponent.";
dflt: "all";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
values: readonly ["all", "first", "last", "none"];
}>;
showgrid: Attr<boolean, {
description: "Draw grid lines at each tick.";
dflt: true;
editType: "ticks";
}>;
showline: Attr<boolean, {
description: "Draw the axis line.";
dflt: false;
editType: EditType;
}>;
showspikes: Attr<boolean, {
description: "Draw a spike line from the hovered point to this axis. Defaults to `false`, or `true` when any other `spike*` attribute is set or `hovermode` is this axis' unified mode (`x unified` for x axes).";
editType: "modebar";
}>;
showticklabels: Attr<boolean, {
description: "Show tick labels.";
dflt: true;
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
showtickprefix: Attr<"none" | "all" | "first" | "last", {
description: "Which tick labels get `tickprefix`.";
dflt: "all";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
values: readonly ["all", "first", "last", "none"];
}>;
showticksuffix: Attr<"none" | "all" | "first" | "last", {
description: "Which tick labels get `ticksuffix`.";
dflt: "all";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
values: readonly ["all", "first", "last", "none"];
}>;
side: Attr<"top" | "bottom", {
description: "Which side of the plot area the axis is drawn on.";
dflt: "bottom";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
values: readonly ["bottom", "top"];
}>;
spikecolor: Attr<string, {
description: "Spike line color. Defaults to the hovered point's color (or a contrasting color when that is too close to the background).";
editType: "none";
}>;
spikedash: Attr<string, {
description: "Spike line dash (`dot` in unified hover). Dash style: `solid`, `dot`, `dash`, `longdash`, `dashdot`, `longdashdot`, or a CSS-like list of dash lengths in px (`5px,10px,2px,2px`).";
dflt: "dash";
editType: "none";
}>;
spikemode: Attr<
| "toaxis"
| "across"
| "marker"
| `toaxis+${string}`
| `across+${string}`
| `marker+${string}`, {
description: "`toaxis`: from the point to the axis; `across`: across the whole plot area; `marker`: a dot on the axis. Combine with `+` (`across+marker`). Unified hover defaults to `across`.";
dflt: "toaxis";
editType: "none";
flags: readonly ["toaxis", "across", "marker"];
}>;
spikesnap: Attr<"data" | "cursor" | "hovered data", {
description: "`hovered data`: the spike follows the hovered point; `data`: the closest point within `spikedistance`, even when no label shows; `cursor`: the pointer position.";
dflt: "hovered data";
editType: "none";
values: readonly ["data", "cursor", "hovered data"];
}>;
spikethickness: Attr<number, {
description: "Spike line width in px (1.5 in unified hover).";
dflt: 3;
editType: "none";
}>;
tick0: AttrSpec<unknown, unknown>;
tickangle: Attr<number | "auto", {
description: "Tick-label rotation in degrees. `auto` rotates x-axis labels by the first `autotickangles` entry that avoids overlap.";
dflt: "auto";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
extras: readonly ["auto"];
}>;
tickcolor: Attr<string, {
description: "Tick color. Defaults to `color`.";
editType: "ticks";
}>;
tickfont: ObjectNode<{
color: Attr<string, {
description: "Text color.";
}>;
family: Attr<string, {
description: "CSS font-family list. The renderer uses the first family it can load and falls back through the list.";
noBlank: true;
strict: true;
}>;
lineposition: Attr<
| "under"
| "over"
| "through"
| "none"
| `under+${string}`
| `over+${string}`
| `through+${string}`, {
description: "Text decoration: `under`, `over` and/or `through` joined with `+` (e.g. `under+over`), or `none`.";
extras: readonly ["none"];
flags: readonly ["under", "over", "through"];
}>;
shadow: Attr<string, {
description: "CSS `text-shadow` behind the text (`2px 2px 3px black`; only the first shadow is drawn), `none`, or `auto` for a thin halo in the contrast color of the text.";
}>;
size: Attr<number, {
description: "Font size in CSS pixels.";
min: 1;
}>;
style: Attr<"normal" | "italic", {
description: "Font style.";
values: readonly ["normal", "italic"];
}>;
textcase: Attr<"normal" | "word caps" | "upper" | "lower", {
description: "Letter case transform: `upper`, `lower`, `word caps` (first letter of each word), or `normal`.";
values: readonly ["normal", "word caps", "upper", "lower"];
}>;
variant: Attr<
| "normal"
| "small-caps"
| "all-small-caps"
| "all-petite-caps"
| "petite-caps"
| "unicase", {
description: "Capitals variant (CSS `font-variant-caps`). The SDF text renderer approximates small and petite caps with uppercase letters at a reduced size.";
values: readonly ["normal", "small-caps", "all-small-caps", "all-petite-caps", "petite-caps", "unicase"];
}>;
weight: Attr<number | "normal" | "bold", {
description: "Font weight: a CSS numeric weight (1–1000), `normal` or `bold`.";
extras: readonly ["normal", "bold"];
max: 1000;
min: 1;
}>;
}>;
tickformat: Attr<string, {
description: "Tick-label format: a d3-format specifier for numbers (`.2f`, `~s`, `$,`) or a d3-time-format specifier for dates (`%b %Y`), plus `%{n}f` for `n` digits of fractional seconds and `%h` for the half year. Empty picks a format automatically.";
dflt: "";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
tickformatstops: ItemsNode<object & TemplatedItemChildren>;
ticklabelmode: Attr<"instant" | "period", {
description: "Date axes: `instant` labels the tick instant; `period` centers each label in the period that starts at its tick (e.g. month names between month ticks).";
dflt: "instant";
editType: "ticks";
values: readonly ["instant", "period"];
}>;
ticklabeloverflow: Attr<"allow" | "hide past div" | "hide past domain", {
description: "What to do with labels that overflow: keep them, or hide those past the figure or the axis domain. Defaults to `hide past div` for outside labels and `hide past domain` for inside labels.";
editType: "ticks";
values: readonly ["allow", "hide past div", "hide past domain"];
}>;
ticklabelposition: Attr<
| "outside"
| "inside"
| "outside top"
| "inside top"
| "outside left"
| "inside left"
| "outside right"
| "inside right"
| "outside bottom"
| "inside bottom", {
description: "Tick labels outside or inside the plot area, optionally shifted to one side of the tick (`top`/`bottom` for y axes, `left`/`right` for x axes).";
dflt: "outside";
editType: EditType;
values: readonly ["outside", "inside", "outside top", "inside top", "outside left", "inside left", "outside right", "inside right", "outside bottom", "inside bottom"];
}>;
ticklabelshift: Attr<number, {
description: "Shift of tick labels along the axis, in px.";
dflt: 0;
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
ticklabelstandoff: Attr<number, {
description: "Extra distance between tick labels and ticks, in px.";
dflt: 0;
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
ticklabelstep: Attr<number, {
description: "Label every n-th tick only (`tickmode` `auto` and `linear`).";
dflt: 1;
editType: "ticks";
min: 1;
}>;
ticklen: Attr<number, {
description: "Tick length in px.";
dflt: 5;
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
min: 0;
}>;
tickmode: Attr<"auto" | "linear" | "array" | "sync", {
description: "`auto` picks up to `nticks` round ticks; `linear` places ticks from `tick0` every `dtick`; `array` uses `tickvals`/`ticktext`; `sync` aligns with the overlaid axis (reserved; behaves as `auto`). Defaults to `array` when `tickvals` is set, `linear` when `dtick` is set, else `auto`.";
editType: "ticks";
values: readonly ["auto", "linear", "array", "sync"];
}>;
tickprefix: Attr<string, {
description: "Text before each tick label.";
dflt: "";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
ticks: Attr<"" | "outside" | "inside", {
description: "Draw tick marks outside or inside the plot area, or not at all (`''`).";
dflt: "";
editType: EditType;
values: readonly ["outside", "inside", ""];
}>;
ticksuffix: Attr<string, {
description: "Text after each tick label.";
dflt: "";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
ticktext: AttrSpec<DataArray, DataArray | undefined>;
tickvals: AttrSpec<DataArray, DataArray | undefined>;
tickwidth: Attr<number, {
description: "Tick width in px.";
dflt: 1;
editType: "ticks";
min: 0;
}>;
title: ObjectNode<{
font: ObjectNode<{
color: Attr<string, {
description: "Text color.";
}>;
family: Attr<string, {
description: "CSS font-family list. The renderer uses the first family it can load and falls back through the list.";
noBlank: true;
strict: true;
}>;
lineposition: Attr<
| "under"
| "over"
| "through"
| "none"
| `under+${(...)}`
| `over+${(...)}`
| `through+${(...)}`, {
description: "Text decoration: `under`, `over` and/or `through` joined with `+` (e.g. `under+over`), or `none`.";
extras: readonly [...];
flags: readonly [..., ..., ...];
}>;
shadow: Attr<string, {
description: "CSS `text-shadow` behind the text (`2px 2px 3px black`; only the first shadow is drawn), `none`, or `auto` for a thin halo in the contrast color of the text.";
}>;
size: Attr<number, {
description: "Font size in CSS pixels.";
min: 1;
}>;
style: Attr<"normal" | "italic", {
description: "Font style.";
values: readonly [..., ...];
}>;
textcase: Attr<"normal" | "word caps" | "upper" | "lower", {
description: "Letter case transform: `upper`, `lower`, `word caps` (first letter of each word), or `normal`.";
values: readonly [..., ..., ..., ...];
}>;
variant: Attr<
| "normal"
| "small-caps"
| "all-small-caps"
| "all-petite-caps"
| "petite-caps"
| "unicase", {
description: "Capitals variant (CSS `font-variant-caps`). The SDF text renderer approximates small and petite caps with uppercase letters at a reduced size.";
values: readonly [..., ..., ..., ..., ..., ...];
}>;
weight: Attr<number | "normal" | "bold", {
description: "Font weight: a CSS numeric weight (1–1000), `normal` or `bold`.";
extras: readonly [..., ...];
max: 1000;
min: 1;
}>;
}>;
standoff: Attr<number, {
description: "Distance in px between the tick labels and the title. By default it follows the tick labels automatically.";
min: 0;
}>;
text: Attr<string, {
description: "Axis title text (supports rich-text tags, E2.10).";
dflt: "";
}>;
}>;
type: Attr<"linear" | "-" | "log" | "date" | "category" | "multicategory", {
description: "Axis type. `'-'` detects the type from the data of the first trace on this axis (Plotly's rules: mostly dates → `date`; more than twice as many distinct strings as numbers → `category`; two-level `[[groups], [items]]` arrays → `multicategory`; otherwise `linear`).";
dflt: "-";
editType: "calc";
values: readonly ["-", "linear", "log", "date", "category", "multicategory"];
}>;
visible: Attr<boolean, {
description: "Draw the axis (line, ticks, labels, grid and title). A hidden axis still maps data to pixels.";
dflt: true;
editType: EditType;
}>;
zeroline: Attr<boolean, {
description: "Draw a line at 0 (linear axes whose range contains 0).";
dflt: true;
editType: "ticks";
}>;
zerolinecolor: Attr<string, {
description: "Zero line color. Defaults to `color`.";
editType: "ticks";
}>;
zerolinewidth: Attr<number, {
description: "Zero line width in px.";
dflt: 1;
editType: "ticks";
min: 0;
}>;
}>;
yaxis: ObjectNode<{
anchor: Attr<"x" | "free" | `x${number}`, {
description: "The x axis this axis is drawn against, or `free`. Defaults to the x axis of the first subplot using this axis.";
dflt: "x";
editType: "layout";
extras: readonly ["free"];
}>;
automargin: Attr<
| boolean
| "left"
| "right"
| "top"
| "bottom"
| "height"
| "width"
| `left+${string}`
| `right+${string}`
| `top+${string}`
| `bottom+${string}`
| `height+${string}`
| `width+${string}`, {
description: "Grow the figure margins so tick labels and the title fit (E4.2). `true` allows every direction; flags restrict it.";
dflt: false;
editType: EditType;
extras: readonly [true, false];
flags: readonly ["height", "width", "left", "right", "top", "bottom"];
}>;
autorange: Attr<boolean | "reversed" | "min reversed" | "max reversed" | "min" | "max", {
description: "Whether the range is computed from the data. `reversed` autoranges with the axis flipped. `min`/`max` autorange only that end and take the other from `range` (`min reversed`/`max reversed` also flip the axis). Defaults to `false` when a full `range` is given, to `min`/`max` when one end of `range` is `null`, and to `reversed` on a y axis only `image` traces use (row 0 at the top, as in Plotly).";
dflt: true;
editType: EditType;
values: readonly [true, false, "reversed", "min reversed", "max reversed", "min", "max"];
}>;
autorangeoptions: ObjectNode<{
clipmax: AttrSpec<unknown, unknown>;
clipmin: AttrSpec<unknown, unknown>;
include: AttrSpec<unknown, unknown>;
maxallowed: AttrSpec<unknown, unknown>;
minallowed: AttrSpec<unknown, unknown>;
}>;
autoshift: Attr<boolean, {
description: "y axes with `anchor: 'free'` only: move the axis sideways so it does not overlap other free axes on the same side (and default `position` to the overlaid plot's edge, `automargin` to `true`, `shift` to ∓3 px). Plotly semantics.";
editType: EditType;
}>;
autotickangles: AttrSpec<number[], number[]>;
autotypenumbers: Attr<"convert types" | "strict", {
description: "How type detection treats numeric strings: `convert types` counts `'12'` as a number; `strict` counts only real numbers, so numeric strings make a `category` axis.";
dflt: "convert types";
editType: "calc";
values: readonly ["convert types", "strict"];
}>;
categoryarray: AttrSpec<DataArray, DataArray | undefined>;
categoryorder: Attr<
| "array"
| "trace"
| "category ascending"
| "category descending"
| "total ascending"
| "total descending"
| "min ascending"
| "min descending"
| "max ascending"
| "max descending"
| "sum ascending"
| "sum descending"
| "mean ascending"
| "mean descending"
| "median ascending"
| "median descending", {
description: "Order of categories: as they first appear in the traces (`trace`), alphabetical/numerical (`category ascending|descending`), `categoryarray` first (`array`), or by an aggregate of the trace values per category (`total`, `min`, `max`, `sum`, `mean`, `median`). Defaults to `array` when `categoryarray` is set, else `trace`.";
editType: "calc";
values: readonly ["trace", "category ascending", "category descending", "array", "total ascending", "total descending", "min ascending", "min descending", "max ascending", "max descending", "sum ascending", "sum descending", "mean ascending", "mean descending", "median ascending", "median descending"];
}>;
color: Attr<string, {
description: "Base color of the axis: the default for `linecolor`, `tickcolor`, `zerolinecolor`, `dividercolor` and (when changed) the tick-label and title font colors.";
dflt: "#444";
editType: "ticks";
}>;
constrain: Attr<"range" | "domain", {
description: "How a `scaleanchor` / `matches` constraint is met on this axis: `range` widens the range, `domain` shrinks the axis (and its subplot) inside its `domain`. Default `domain` on the axes of `image` traces (Plotly).";
dflt: "range";
editType: EditType;
values: readonly ["range", "domain"];
}>;
constraintoward: Attr<"left" | "center" | "right" | "top" | "middle" | "bottom", {
description: "Which end stays put when a constraint changes the range or domain: `left`/`center`/`right` for x axes (default `center`), `bottom`/`middle`/`top` for y axes (default `middle`).";
editType: EditType;
values: readonly ["left", "center", "right", "top", "middle", "bottom"];
}>;
dividercolor: Attr<string, {
description: "Multicategory divider color. Defaults to `color`.";
editType: "ticks";
}>;
dividerwidth: Attr<number, {
description: "Multicategory divider width in px.";
dflt: 1;
editType: "ticks";
min: 0;
}>;
domain: AttrSpec<[number, number], [number, number]>;
dtick: AttrSpec<unknown, unknown>;
exponentformat: Attr<"none" | "e" | "E" | "power" | "SI" | "B", {
description: "How large and small numbers are written: `none` (1000000), `e` (1e+6), `E` (1E+6), `power` (1×10⁶), `SI` (1M), `B` (like SI but 1B for 10⁹).";
dflt: "B";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
values: readonly ["none", "e", "E", "power", "SI", "B"];
}>;
fixedrange: Attr<boolean, {
description: "Disables zoom and pan on this axis (drag, scroll, and modebar zoom leave its range alone).";
dflt: false;
editType: "none";
}>;
gridcolor: Attr<string, {
description: "Grid line color.";
dflt: "#eee";
editType: "ticks";
}>;
griddash: Attr<string, {
description: "Dash style: `solid`, `dot`, `dash`, `longdash`, `dashdot`, `longdashdot`, or a CSS-like list of dash lengths in px (`5px,10px,2px,2px`).";
dflt: "solid";
editType: "ticks";
}>;
gridwidth: Attr<number, {
description: "Grid line width in px.";
dflt: 1;
editType: "ticks";
min: 0;
}>;
hoverformat: Attr<string, {
description: "Format of this axis’ values in hover labels (same syntax as `tickformat`). Empty uses the tick format with extra precision.";
dflt: "";
editType: "none";
}>;
layer: Attr<"above traces" | "below traces", {
description: "Draw the axis line, ticks and labels above or below the traces. Grid lines are always below.";
dflt: "above traces";
editType: "plot";
values: readonly ["above traces", "below traces"];
}>;
linecolor: Attr<string, {
description: "Axis line color. Defaults to `color`.";
editType: "ticks";
}>;
linewidth: Attr<number, {
description: "Axis line width in px.";
dflt: 1;
editType: "ticks";
min: 0;
}>;
matches: Attr<string, {
description: "Link this axis' range to another axis of the same type (`'x'`, `'x2'`, `'y'`, …): they autorange together over all their data, and zoom, pan and `relayout` of one move all. The linked axes share `range`, `autorange`, `rangemode`, `rangebreaks`, `constrain` and the category order. An axis that would create a loop, or a target of another type, is ignored.";
editType: "calc";
noBlank: true;
strict: true;
}>;
maxallowed: AttrSpec<unknown, unknown>;
minallowed: AttrSpec<unknown, unknown>;
minexponent: Attr<number, {
description: "Smallest decimal exponent written in exponent form (`SI`/`B` and exponent formats); smaller magnitudes are written out in full.";
dflt: 3;
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
min: 0;
}>;
minor: ObjectNode<{
dtick: AttrSpec<unknown, unknown>;
gridcolor: Attr<string, {
description: "Minor grid color. Defaults to `gridcolor` blended halfway to the plot background.";
}>;
griddash: Attr<string, {
description: "Minor grid dash style. Defaults to `griddash`. Dash style: `solid`, `dot`, `dash`, `longdash`, `dashdot`, `longdashdot`, or a CSS-like list of dash lengths in px (`5px,10px,2px,2px`).";
}>;
gridwidth: Attr<number, {
description: "Minor grid width in px. Defaults to `gridwidth`.";
min: 0;
}>;
nticks: Attr<number, {
description: "Maximum number of minor ticks per major interval for `tickmode: auto` (0 picks it from the axis length).";
dflt: 5;
min: 0;
}>;
showgrid: Attr<boolean, {
description: "Draw minor grid lines.";
dflt: false;
}>;
tick0: AttrSpec<unknown, unknown>;
tickcolor: Attr<string, {
description: "Minor tick color. Defaults to `tickcolor`.";
}>;
ticklen: Attr<number, {
description: "Minor tick length in px. Defaults to 60% of `ticklen`.";
min: 0;
}>;
tickmode: Attr<"auto" | "linear" | "array", {
description: "As the major `tickmode`. Defaults to `array` when `minor.tickvals` is set, `linear` when `minor.dtick` is set, else `auto`.";
values: readonly ["auto", "linear", "array"];
}>;
ticks: Attr<"" | "outside" | "inside", {
description: "Draw minor tick marks outside or inside the plot area, or not at all.";
dflt: "";
values: readonly ["outside", "inside", ""];
}>;
tickvals: AttrSpec<DataArray, DataArray | undefined>;
tickwidth: Attr<number, {
description: "Minor tick width in px. Defaults to `tickwidth`.";
min: 0;
}>;
}>;
minorloglabels: Attr<"none" | "small digits" | "complete", {
description: "Log axes whose automatic ticks fall between powers of ten (2, 5 or every digit): `small digits` labels them with a small digit (2, 5), `complete` with the full value in the tick font, with `tickprefix`/`ticksuffix` (20, 50, 200), `none` leaves them unlabelled.";
dflt: "small digits";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
values: readonly ["small digits", "complete", "none"];
}>;
mirror: Attr<boolean | "all" | "ticks" | "allticks", {
description: "Repeat the axis line on the opposite side of the plot area: `true` (line), `ticks` (line and ticks); `all`/`allticks` do the same on every subplot sharing this axis.";
dflt: false;
editType: EditType;
values: readonly [true, "ticks", false, "all", "allticks"];
}>;
nticks: Attr<number, {
description: "Maximum number of ticks for `tickmode: auto` (the actual number may be lower so steps stay round). 0 picks it from the axis length.";
dflt: 0;
editType: "ticks";
min: 0;
}>;
overlaying: AttrSpec<"y" | `y${number}` | "free", "y" | `y${number}` | "free" | undefined>;
position: Attr<number, {
description: "Position of the axis in paper coordinates (0–1 across the x direction). Only used when `anchor` is `free`.";
dflt: 0;
editType: EditType;
max: 1;
min: 0;
}>;
range: AttrSpec<[unknown, unknown], [unknown, unknown] | undefined>;
rangebreaks: ItemsNode<object & TemplatedItemChildren>;
rangemode: Attr<"normal" | "tozero" | "nonnegative", {
description: "Linear axes only. `tozero` extends the autorange to include 0; `nonnegative` keeps it ≥ 0.";
dflt: "normal";
editType: EditType;
values: readonly ["normal", "tozero", "nonnegative"];
}>;
scaleanchor: AttrSpec<unknown, unknown>;
scaleratio: Attr<number, {
description: "With `scaleanchor`: px per unit of this axis divided by px per unit of the anchor axis (2 makes one unit here twice as long).";
dflt: 1;
editType: EditType;
min: 0;
}>;
separatethousands: Attr<boolean, {
description: "Always separate thousands (1,000). By default only numbers with 5 or more integer digits are separated.";
dflt: false;
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
shift: Attr<number, {
description: "y axes with `anchor: 'free'` only: extra horizontal offset in px (negative to the left). Defaults to -3 on the left and 3 on the right when `autoshift` is on, else 0.";
editType: EditType;
}>;
showdividers: Attr<boolean, {
description: "Multicategory axes: draw divider lines between groups.";
dflt: true;
editType: "ticks";
}>;
showexponent: Attr<"none" | "all" | "first" | "last", {
description: "Which tick labels show the exponent.";
dflt: "all";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
values: readonly ["all", "first", "last", "none"];
}>;
showgrid: Attr<boolean, {
description: "Draw grid lines at each tick.";
dflt: true;
editType: "ticks";
}>;
showline: Attr<boolean, {
description: "Draw the axis line.";
dflt: false;
editType: EditType;
}>;
showspikes: Attr<boolean, {
description: "Draw a spike line from the hovered point to this axis. Defaults to `false`, or `true` when any other `spike*` attribute is set or `hovermode` is this axis' unified mode (`x unified` for x axes).";
editType: "modebar";
}>;
showticklabels: Attr<boolean, {
description: "Show tick labels.";
dflt: true;
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
showtickprefix: Attr<"none" | "all" | "first" | "last", {
description: "Which tick labels get `tickprefix`.";
dflt: "all";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
values: readonly ["all", "first", "last", "none"];
}>;
showticksuffix: Attr<"none" | "all" | "first" | "last", {
description: "Which tick labels get `ticksuffix`.";
dflt: "all";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
values: readonly ["all", "first", "last", "none"];
}>;
side: Attr<"left" | "right", {
description: "Which side of the plot area the axis is drawn on.";
dflt: "left";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
values: readonly ["left", "right"];
}>;
spikecolor: Attr<string, {
description: "Spike line color. Defaults to the hovered point's color (or a contrasting color when that is too close to the background).";
editType: "none";
}>;
spikedash: Attr<string, {
description: "Spike line dash (`dot` in unified hover). Dash style: `solid`, `dot`, `dash`, `longdash`, `dashdot`, `longdashdot`, or a CSS-like list of dash lengths in px (`5px,10px,2px,2px`).";
dflt: "dash";
editType: "none";
}>;
spikemode: Attr<
| "toaxis"
| "across"
| "marker"
| `toaxis+${string}`
| `across+${string}`
| `marker+${string}`, {
description: "`toaxis`: from the point to the axis; `across`: across the whole plot area; `marker`: a dot on the axis. Combine with `+` (`across+marker`). Unified hover defaults to `across`.";
dflt: "toaxis";
editType: "none";
flags: readonly ["toaxis", "across", "marker"];
}>;
spikesnap: Attr<"data" | "cursor" | "hovered data", {
description: "`hovered data`: the spike follows the hovered point; `data`: the closest point within `spikedistance`, even when no label shows; `cursor`: the pointer position.";
dflt: "hovered data";
editType: "none";
values: readonly ["data", "cursor", "hovered data"];
}>;
spikethickness: Attr<number, {
description: "Spike line width in px (1.5 in unified hover).";
dflt: 3;
editType: "none";
}>;
tick0: AttrSpec<unknown, unknown>;
tickangle: Attr<number | "auto", {
description: "Tick-label rotation in degrees. `auto` rotates x-axis labels by the first `autotickangles` entry that avoids overlap.";
dflt: "auto";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
extras: readonly ["auto"];
}>;
tickcolor: Attr<string, {
description: "Tick color. Defaults to `color`.";
editType: "ticks";
}>;
tickfont: ObjectNode<{
color: Attr<string, {
description: "Text color.";
}>;
family: Attr<string, {
description: "CSS font-family list. The renderer uses the first family it can load and falls back through the list.";
noBlank: true;
strict: true;
}>;
lineposition: Attr<
| "under"
| "over"
| "through"
| "none"
| `under+${string}`
| `over+${string}`
| `through+${string}`, {
description: "Text decoration: `under`, `over` and/or `through` joined with `+` (e.g. `under+over`), or `none`.";
extras: readonly ["none"];
flags: readonly ["under", "over", "through"];
}>;
shadow: Attr<string, {
description: "CSS `text-shadow` behind the text (`2px 2px 3px black`; only the first shadow is drawn), `none`, or `auto` for a thin halo in the contrast color of the text.";
}>;
size: Attr<number, {
description: "Font size in CSS pixels.";
min: 1;
}>;
style: Attr<"normal" | "italic", {
description: "Font style.";
values: readonly ["normal", "italic"];
}>;
textcase: Attr<"normal" | "word caps" | "upper" | "lower", {
description: "Letter case transform: `upper`, `lower`, `word caps` (first letter of each word), or `normal`.";
values: readonly ["normal", "word caps", "upper", "lower"];
}>;
variant: Attr<
| "normal"
| "small-caps"
| "all-small-caps"
| "all-petite-caps"
| "petite-caps"
| "unicase", {
description: "Capitals variant (CSS `font-variant-caps`). The SDF text renderer approximates small and petite caps with uppercase letters at a reduced size.";
values: readonly ["normal", "small-caps", "all-small-caps", "all-petite-caps", "petite-caps", "unicase"];
}>;
weight: Attr<number | "normal" | "bold", {
description: "Font weight: a CSS numeric weight (1–1000), `normal` or `bold`.";
extras: readonly ["normal", "bold"];
max: 1000;
min: 1;
}>;
}>;
tickformat: Attr<string, {
description: "Tick-label format: a d3-format specifier for numbers (`.2f`, `~s`, `$,`) or a d3-time-format specifier for dates (`%b %Y`), plus `%{n}f` for `n` digits of fractional seconds and `%h` for the half year. Empty picks a format automatically.";
dflt: "";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
tickformatstops: ItemsNode<object & TemplatedItemChildren>;
ticklabelmode: Attr<"instant" | "period", {
description: "Date axes: `instant` labels the tick instant; `period` centers each label in the period that starts at its tick (e.g. month names between month ticks).";
dflt: "instant";
editType: "ticks";
values: readonly ["instant", "period"];
}>;
ticklabeloverflow: Attr<"allow" | "hide past div" | "hide past domain", {
description: "What to do with labels that overflow: keep them, or hide those past the figure or the axis domain. Defaults to `hide past div` for outside labels and `hide past domain` for inside labels.";
editType: "ticks";
values: readonly ["allow", "hide past div", "hide past domain"];
}>;
ticklabelposition: Attr<
| "outside"
| "inside"
| "outside top"
| "inside top"
| "outside left"
| "inside left"
| "outside right"
| "inside right"
| "outside bottom"
| "inside bottom", {
description: "Tick labels outside or inside the plot area, optionally shifted to one side of the tick (`top`/`bottom` for y axes, `left`/`right` for x axes).";
dflt: "outside";
editType: EditType;
values: readonly ["outside", "inside", "outside top", "inside top", "outside left", "inside left", "outside right", "inside right", "outside bottom", "inside bottom"];
}>;
ticklabelshift: Attr<number, {
description: "Shift of tick labels along the axis, in px.";
dflt: 0;
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
ticklabelstandoff: Attr<number, {
description: "Extra distance between tick labels and ticks, in px.";
dflt: 0;
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
ticklabelstep: Attr<number, {
description: "Label every n-th tick only (`tickmode` `auto` and `linear`).";
dflt: 1;
editType: "ticks";
min: 1;
}>;
ticklen: Attr<number, {
description: "Tick length in px.";
dflt: 5;
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
min: 0;
}>;
tickmode: Attr<"auto" | "linear" | "array" | "sync", {
description: "`auto` picks up to `nticks` round ticks; `linear` places ticks from `tick0` every `dtick`; `array` uses `tickvals`/`ticktext`; `sync` aligns with the overlaid axis (reserved; behaves as `auto`). Defaults to `array` when `tickvals` is set, `linear` when `dtick` is set, else `auto`.";
editType: "ticks";
values: readonly ["auto", "linear", "array", "sync"];
}>;
tickprefix: Attr<string, {
description: "Text before each tick label.";
dflt: "";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
ticks: Attr<"" | "outside" | "inside", {
description: "Draw tick marks outside or inside the plot area, or not at all (`''`).";
dflt: "";
editType: EditType;
values: readonly ["outside", "inside", ""];
}>;
ticksuffix: Attr<string, {
description: "Text after each tick label.";
dflt: "";
editType: readonly (
| "none"
| "ticks"
| "legend"
| "calc"
| "calcIfAutorange"
| "crossTraceCalc"
| "layout"
| "plot"
| "style"
| "colorbars"
| "modebar"
| "camera")[];
}>;
ticktext: AttrSpec<DataArray, DataArray | undefined>;
tickvals: AttrSpec<DataArray, DataArray | undefined>;
tickwidth: Attr<number, {
description: "Tick width in px.";
dflt: 1;
editType: "ticks";
min: 0;
}>;
title: ObjectNode<{
font: ObjectNode<{
color: Attr<string, {
description: "Text color.";
}>;
family: Attr<string, {
description: "CSS font-family list. The renderer uses the first family it can load and falls back through the list.";
noBlank: true;
strict: true;
}>;
lineposition: Attr<
| "under"
| "over"
| "through"
| "none"
| `under+${(...)}`
| `over+${(...)}`
| `through+${(...)}`, {
description: "Text decoration: `under`, `over` and/or `through` joined with `+` (e.g. `under+over`), or `none`.";
extras: readonly [...];
flags: readonly [..., ..., ...];
}>;
shadow: Attr<string, {
description: "CSS `text-shadow` behind the text (`2px 2px 3px black`; only the first shadow is drawn), `none`, or `auto` for a thin halo in the contrast color of the text.";
}>;
size: Attr<number, {
description: "Font size in CSS pixels.";
min: 1;
}>;
style: Attr<"normal" | "italic", {
description: "Font style.";
values: readonly [..., ...];
}>;
textcase: Attr<"normal" | "word caps" | "upper" | "lower", {
description: "Letter case transform: `upper`, `lower`, `word caps` (first letter of each word), or `normal`.";
values: readonly [..., ..., ..., ...];
}>;
variant: Attr<
| "normal"
| "small-caps"
| "all-small-caps"
| "all-petite-caps"
| "petite-caps"
| "unicase", {
description: "Capitals variant (CSS `font-variant-caps`). The SDF text renderer approximates small and petite caps with uppercase letters at a reduced size.";
values: readonly [..., ..., ..., ..., ..., ...];
}>;
weight: Attr<number | "normal" | "bold", {
description: "Font weight: a CSS numeric weight (1–1000), `normal` or `bold`.";
extras: readonly [..., ...];
max: 1000;
min: 1;
}>;
}>;
standoff: Attr<number, {
description: "Distance in px between the tick labels and the title. By default it follows the tick labels automatically.";
min: 0;
}>;
text: Attr<string, {
description: "Axis title text (supports rich-text tags, E2.10).";
dflt: "";
}>;
}>;
type: Attr<"linear" | "-" | "log" | "date" | "category" | "multicategory", {
description: "Axis type. `'-'` detects the type from the data of the first trace on this axis (Plotly's rules: mostly dates → `date`; more than twice as many distinct strings as numbers → `category`; two-level `[[groups], [items]]` arrays → `multicategory`; otherwise `linear`).";
dflt: "-";
editType: "calc";
values: readonly ["-", "linear", "log", "date", "category", "multicategory"];
}>;
visible: Attr<boolean, {
description: "Draw the axis (line, ticks, labels, grid and title). A hidden axis still maps data to pixels.";
dflt: true;
editType: EditType;
}>;
zeroline: Attr<boolean, {
description: "Draw a line at 0 (linear axes whose range contains 0).";
dflt: true;
editType: "ticks";
}>;
zerolinecolor: Attr<string, {
description: "Zero line color. Defaults to `color`.";
editType: "ticks";
}>;
zerolinewidth: Attr<number, {
description: "Zero line width in px.";
dflt: 1;
editType: "ticks";
min: 0;
}>;
}>;
}>;Experimental
The base layout schema. Registry-merged with trace-module and component layout attributes.