MAIDR JavaScript API
    Preparing search index...

    Interface MaidrLayer

    Layer/trace definition containing plot type, data, and rendering configuration.

    interface MaidrLayer {
        id: string;
        type: TraceType;
        title?: string;
        name?: string;
        typeLabel?: string;
        typeGuide?: TypeGuide;
        diagramType?: DiagramType;
        selectors?:
            | string
            | string[]
            | CandlestickSelector
            | (string | null)[][]
            | BoxSelector[];
        orientation?: Orientation;
        startAngle?: number;
        direction?: PieDirection;
        domMapping?: {
            order?: "row" | "column";
            groupDirection?: "reverse" | "forward";
            iqrDirection?: "reverse" | "forward";
            pointOrder?: "reverse" | "data";
        };
        axes?: { x?: AxisConfig; y?: AxisConfig; z?: AxisConfig };
        forestOptions?: ForestOptions;
        flowOptions?: FlowOptions;
        thresholdOptions?: ThresholdOptions;
        violinOptions?: ViolinOptions;
        stepDirection?: StepDirection;
        firstPlace?: "top" | "bottom";
        whiskerQuantiles?: [number, number];
        data:
            | GaugePoint
            | GanttData
            | DumbbellData
            | HeatmapData
            | SequenceData
            | BarPoint[]
            | FlowPoint[]
            | NetworkPoint[]
            | DirectedGraphPoint[]
            | BoxPoint[]
            | BoxenPoint[]
            | CandlestickPoint[]
            | ErrorBarPoint[]
            | ErrorBarPoint[][]
            | ForestPoint[]
            | VennPoint[]
            | HexbinPoint[][]
            | HistogramPoint[]
            | LinePoint[][]
            | PiePoint[]
            | PrCurvePoint[][]
            | PercentileBandPoint[]
            | RocPoint[][]
            | RugPoint[]
            | ScatterPoint[]
            | MosaicPoint[][]
            | VolcanoPoint[]
            | SegmentedPoint[][]
            | SmoothPoint[][]
            | ContourPoint[][]
            | ChoroplethPoint[]
            | SurvivalPoint[][]
            | TreemapPoint[]
            | ViolinKdePoint[][]
            | WaterfallPoint[]
            | WordCloudPoint[];
    }
    Index

    Properties

    id: string
    type: TraceType
    title?: string
    name?: string

    What this layer is, when a subplot's layers are the same kind of thing.

    Announced on a layer switch in place of the trace type. Without it, two layers of one type are indistinguishable — a hue-split error bar chart announces "Layer 1 of 2: error_bar plot" and then "Layer 2 of 2: error_bar plot", so a reader hears two different sets of numbers and is never told that the first is Male and the second Female, which is the whole content of the split and what a legend gives a sighted reader for free.

    Distinct from title, which names the chart rather than the layer: producers put the figure's title there for every layer of a figure, so it cannot say which layer this is.

    name: 'Male'
    
    typeLabel?: string

    What the chart is called, when it is read as a trace type it is not: a deal pipeline read as a tree, its stages columns and its deals cards.

    Said in place of the trace type's name wherever the chart's type is named -- its accessible name, the instruction on entering it, the description's Chart Type and layer tab, a layer switch -- and the description leaves out its "About this chart type" guide, which explains the trace type rather than this chart, unless the layer gives a guide to its own chart in typeGuide. Written as given, in every language, as title is: a diagram MAIDR knows is better named by diagramType, which MAIDR says in the reader's language.

    typeLabel: 'Deal Pipeline'
    
    typeGuide?: TypeGuide

    A plain-language introduction to the chart typeLabel names, shown in the description's "About this chart type" section in place of the guide to the trace type, which a layer that names its chart leaves out.

    Read only beside a typeLabel: that section is headed with the chart type's name, and without one it names the trace type, which this guide does not explain. All three parts must be given, since the section reads all three; a guide missing one, or blank in one, is not shown. Written as given, in every language, as typeLabel is.

    typeGuide: {
    definition: 'A deal pipeline shows deals as cards in columns, one for each stage of a sale.',
    purpose: 'It is used to see how many deals are at each stage, and which are stuck.',
    appearance: 'Columns stand side by side, each headed by its stage, with a card for each deal.',
    }
    diagramType?: DiagramType

    What the chart is, when it is a diagram MAIDR knows but reads as a layer type it is not: a Mermaid flowchart read as a directed_graph, a kanban board as a tree, a packet diagram as a gantt.

    MAIDR names the diagram wherever typeLabel would name it, and explains it in the description's "About this chart type" guide, both in the reader's language, as it does a layer type. Where MAIDR knows the diagram, this wins over typeLabel and typeGuide; a producer may give those as well, for a MAIDR that does not, and they are read as before. One this MAIDR does not know is said in the console.

    diagramType: DiagramType.FLOWCHART // "flowchart" in JSON
    
    selectors?:
        | string
        | string[]
        | CandlestickSelector
        | (string | null)[][]
        | BoxSelector[]

    Which element of the chart each point of the layer is drawn as.

    What each shape means depends on the layer type, and is written down per type in the "Selectors" section of docs/SCHEMA.md: a string is resolved with querySelectorAll; a list is one element per point for a bar, one per series for the line family, and resolved entry by entry for most others; a grid names one element per cell of a segmented layer or a heat map. A layer whose selectors resolve to nothing is still read aloud, and MAIDR says so in the console.

    A grid cell may be null, which says the chart drew no element for that cell — a category a series has no bar at, or a position a heat grid is not a rectangle at. That is different from a selector that fails to resolve, which is a mistake and declines the whole grid: without a way to tell the two apart, a producer whose layer has a gap has to choose between losing the highlight everywhere and inferring the gaps from the values, and a value of zero is not evidence that a bar was never drawn (#1002).

    It is also not the same as a null in HeatmapData.points, which says the chart drew no value. A calendar has both, at different cells: a day inside the year with no row is drawn as a white square, so it has an element and no value, while the slots outside the year have neither (#1174).

    orientation?: Orientation

    Which way the layer is drawn. Defaults to Orientation.VERTICAL.

    For one family of traces this key decides which field of a point holds the magnitude, so getting it wrong is not a cosmetic error — the trace reads a category name where it expects a number and sounds with no magnitude at all. For every other trace it changes only which axis label a reading is announced against, and the payload is written the same way whichever value is set.

    What the two words name. Orientation is the direction the magnitude runs, not which axis happens to be called x. That is the convention the whole field uses: a horizontal bar chart is one whose bars run left to right, with the categories down the y axis — and it is how the drawing libraries name the same switch. Chart.js: indexAxis: 'y' gives "horizontal bars", the y axis holding the categories and the x axis the values. Highcharts: chart.inverted makes "the x axis vertical and y axis horizontal". Matplotlib 3.10 replaced boxplot(vert=False) with orientation='horizontal', which "plots the boxes horizontally". Plotly states it outright: with 'h', "the value of each bar spans along the horizontal".

    A producer therefore reads its chart, not its API's vocabulary. Where a library names the other direction — ECharts' and amCharts' funnel orient/orientation name the way the stages progress, so their default funnels encode the value as a band's width and are horz here — the adapter translates, and says so where it does.

    The rule is: the bar family swaps x and y; nothing else does.

    trace vert horz
    the bar family, listed below x is the category, y the magnitude x is the magnitude, y the category
    error_bar, forest x is the category, y/yMin/yMax the magnitudes unchanged — only the axis labels swap
    box, boxen, violin_box quantile fields, no axis assignment unchanged
    gantt, dumbbell — unchanged; navigation and panning only
    rug the ticks stand on the x axis and x is the position the ticks lie along the y axis and y is the position

    The bar family is defined by what a type is built on rather than by what it is called, because the exchange is inherited from AbstractBarPlot's constructor: bar, histogram, stacked, dodged, normalized and the traces built on those (diverging, mosaic) — and also dot and lollipop, which the factory constructs as a BarTrace outright, and funnel, whose trace extends BarTrace and never undoes the exchange. Reading one model file at a time misses those last three, so test/type/orientationContract.test.ts runs the list rather than restating it.

    Note that this is a different question from the one resolveOrientation() in src/util/orientation.ts answers. Its IS_ORIENTED record says whether a type has an orientation worth announcing ("vertical bar plot"); a type can be oriented in that sense and still not want its payload swapped, which is the trap this table exists to close. Both r-maidr #184 and #186 were emitted against the wrong half of it.

    // a horizontal bar chart of apple = 30
    { orientation: 'horz', data: [{ x: 30, y: 'apple' }] }
    startAngle?: number

    Where a pie's first slice begins, in degrees clockwise from 12 o'clock. Defaults to 0.

    MAIDR lays the slices of a pie out round a dial from this point — the audio pan follows each slice round the circle and p names the slice's clock position — so a producer whose pie does not start at the top says where it does. matplotlib's default startangle=0 puts the first edge at 3 o'clock, which is 90 here; its startangle=90 is 0. Chart.js's rotation is already clockwise from the top and carries over unchanged. Plotly's rotation is too, but a counterclockwise plotly pie starts rotation plus its first wedge's sweep round: plotly ends the first wedge at rotation and draws it clockwise of there, then lays the rest out counterclockwise from rotation.

    Read by the pie trace and ignored by every other type.

    // a pie whose first slice starts at 3 o'clock
    { type: 'pie', startAngle: 90, data: [...] }
    direction?: PieDirection

    The way round the dial a pie's slices follow one another from MaidrLayer.startAngle. Defaults to PieDirection.CLOCKWISE.

    MAIDR steps Right through a pie clockwise: the next slice under the Right arrow is the next one round the dial the way a clock hand goes, whatever order the producer wrote them in. A producer whose library laid the slices out the other way — matplotlib, base R's pie() and plotly all draw counterclockwise by default — says so here, and the trace walks data in reverse: the slice drawn last is the first one clockwise from the start, so Right still moves clockwise and the outline, the pan and the clock position all describe the wedge under the cursor. data and selectors stay in drawn order either way; only the walk changes.

    Read by the pie trace and ignored by every other type. Omit it unless the drawn direction is known: a layer that declares 'counterclockwise' and is not drawn that way walks the pie backwards.

    // a plotly pie drawn with its default direction
    { type: 'pie', direction: 'counterclockwise', data: [...] }
    domMapping?: {
        order?: "row" | "column";
        groupDirection?: "reverse" | "forward";
        iqrDirection?: "reverse" | "forward";
        pointOrder?: "reverse" | "data";
    }

    Optional DOM mapping hints. When provided, individual traces can opt-in to use these hints to map DOM elements to the internal row-major data grid without changing default behavior when omitted.

    Type Declaration

    • Optionalorder?: "row" | "column"

      Specify DOM flattening order for grid-like traces. 'row' => row-major, 'column' => column-major.

    • OptionalgroupDirection?: "reverse" | "forward"

      For segmented/dodged bars walked category by category, which series a category's elements start from. A stack's series are listed bottom segment first. 'forward' => the first series (as previously domOrder='forward'): a column drawn from its bottom segment up, as base R draws one. 'reverse' => the last series (default): a column drawn from its top segment down, as ggplot2 draws one.

    • OptionaliqrDirection?: "reverse" | "forward"

      For boxplots, control the Q1/Q3 edge mapping for IQR box. 'forward' => Q1=bottom, Q3=top (default for vertical) 'reverse' => Q1=top, Q3=bottom (for Base R vertical boxplots)

    • OptionalpointOrder?: "reverse" | "data"

      For a line-family layer, whether the chart draws the series' points in the opposite order from the one data lists them in. 'data' (the default) => the r-th mark drawn is data[r]. 'reverse' => the marks run the other way, so the last one drawn is data[0].

      A reversed category axis draws a series from its far end while the library goes on reporting its points in the order they were written, so a chart read in the written order is announced as its own mirror image: every value right, the shape backwards, and with it the stereo pan, the braille line and the direction autoplay sweeps (#1007).

      A bar layer fixes that adapter-side, by reversing the rows and naming each bar outright so the highlight follows (#995). A line cannot: it has no per-point selector to permute -- LineTrace reads its points out of one <path>'s geometry, in path order, which is the library's data order whichever way the axis runs. Reversing the payload alone would pair data[0] with the vertex at the other end of the chart, trading a correct highlight for a wrong one (#988, #990). This is how an adapter says it has reversed the payload, so the trace can pair the two halves back up.

      Read by LineTrace (and the traces built on it) and ignored by every other type. Omit it unless the drawn direction is known: a layer that declares 'reverse' and is not drawn that way outlines the wrong end of the series, which is worse than the direction being wrong on its own.

    axes?: { x?: AxisConfig; y?: AxisConfig; z?: AxisConfig }

    Axis configuration. Every axis (x, y, z) is specified as an AxisConfig object with an optional label, optional grid navigation properties (min, max, tickStep), and optional per-axis format.

    // Basic labels
    axes: { x: { label: "Date" }, y: { label: "Price" } }
    // With per-axis formatting
    axes: {
    x: { label: "Date" },
    y: { label: "Price", format: { type: "currency", decimals: 2 } }
    }
    // With grid navigation (scatter)
    axes: {
    x: { label: "Sepal Length", min: 4.3, max: 7.9, tickStep: 0.7 },
    y: { label: "Sepal Width", min: 2, max: 4.4, tickStep: 0.5 }
    }
    forestOptions?: ForestOptions

    Display configuration for a forest plot layer.

    flowOptions?: FlowOptions

    Where a sankey, alluvial or chord layer's nodes were drawn.

    thresholdOptions?: ThresholdOptions

    Threshold configuration for a volcano or Manhattan plot layer.

    violinOptions?: ViolinOptions

    Optional display configuration for violin plot layers (VIOLIN_KDE and VIOLIN_BOX). Controls which summary statistics are shown in the violin box overlay.

    stepDirection?: StepDirection

    Where a TraceType.STEP layer jumps between samples, and how a stepped TraceType.AREA band moves between them. Read by StepTrace and by AreaTrace -- line.shape and a fill are independent, so a band can be a staircase -- and ignored by every other trace type. Omit it when the producing library does not report one, rather than guessing: the announcement names the convention, and naming the wrong one is worse than staying silent.

    firstPlace?: "top" | "bottom"

    Where a TraceType.BUMP layer draws first place: 'top', as a bump chart is usually drawn, with its rank axis running down the page, or 'bottom', on a chart whose rank axis runs up it.

    Up and Down follow the drawing. With first place at the top, Up moves to the competitor one place better, drawn above, and Control + Up to first place; with first place at the bottom, Up moves one place worse, which is the place drawn above there. The pitch does not change with it: first place is the highest note either way, and ] goes to a competitor's best place.

    Optional. Left out, MAIDR reads where first place is drawn from the marks the highlight resolves, and where it has nothing to measure -- a chart drawn to a canvas, or no highlight -- Up moves to the next larger rank number, as on a line. A layer left without it whose drawing turns Up and Down round from that rule logs a console warning, once, asking for it. Say it where the drawing cannot be measured: the Chart.js and amCharts adapters do, Highcharts says it from its reversed axis, and Frappe, which cannot reverse an axis, says 'bottom'. Read by BumpTrace and ignored by every other type.

    // a bump chart whose rank axis runs up the page
    { type: 'bump', firstPlace: 'bottom', data: [...] }
    whiskerQuantiles?: [number, number]

    The quantiles, from 0 to 1, at which a TraceType.BOX layer's lower and upper whiskers end: [0.1, 0.9] for whiskers drawn to the 10th and 90th percentiles. Read by BoxTrace and ignored by every other type.

    A box's min and max are announced as "Minimum" and "Maximum", which is what they are for a Tukey or a range whisker. A library that draws its whiskers at fixed quantiles instead -- Nivo's box plot defaults to the 10th and 90th -- would have a reader told the 90th percentile was the largest value. With this set, the whisker ends are named as the percentiles they are, in the announcement, the section names and the summary.

    Omit it when the whiskers end at the data's extremes or at 1.5 × IQR; a value of [0, 1], or one that is not two quantiles in increasing order, is treated as absent. Each end is read on its own: a lower end at 0 is still the minimum, and an upper end at 1 the maximum, so [0.05, 1] names only the lower end as a percentile.

    // Nivo's default quantiles, [0.1, 0.25, 0.5, 0.75, 0.9]
    { type: 'box', whiskerQuantiles: [0.1, 0.9], data: [...] }
    data:
        | GaugePoint
        | GanttData
        | DumbbellData
        | HeatmapData
        | SequenceData
        | BarPoint[]
        | FlowPoint[]
        | NetworkPoint[]
        | DirectedGraphPoint[]
        | BoxPoint[]
        | BoxenPoint[]
        | CandlestickPoint[]
        | ErrorBarPoint[]
        | ErrorBarPoint[][]
        | ForestPoint[]
        | VennPoint[]
        | HexbinPoint[][]
        | HistogramPoint[]
        | LinePoint[][]
        | PiePoint[]
        | PrCurvePoint[][]
        | PercentileBandPoint[]
        | RocPoint[][]
        | RugPoint[]
        | ScatterPoint[]
        | MosaicPoint[][]
        | VolcanoPoint[]
        | SegmentedPoint[][]
        | SmoothPoint[][]
        | ContourPoint[][]
        | ChoroplethPoint[]
        | SurvivalPoint[][]
        | TreemapPoint[]
        | ViolinKdePoint[][]
        | WaterfallPoint[]
        | WordCloudPoint[]