MAIDR Documentation - v4.4.0
    Preparing search index...
    • Binds a D3.js boxen (letter-value) plot to MAIDR, generating the accessible data representation.

      Point selector at one element per distribution — the <g> holding that category's stack of nested rungs — the way bindD3Box points at a box group. Every rung of a distribution highlights that group: a chart does not draw an element per quantile that MAIDR could pair up positionally, and inventing one would highlight geometry the chart never drew.

      Parameters

      • svg: Element

        The SVG element containing the D3 boxen plot.

      • config: D3BoxenConfig

        Configuration specifying the selector and data accessors.

      Returns D3BinderResult

      A D3BinderResult with the MAIDR data and generated layer.

      Timing — call after D3 has rendered. Like every D3 binder, this reads each matched element's D3-bound __data__; calling it before .data().join() has run (or before the SVG is mounted) throws "No elements found for selector …" or "Property '…' not found on datum".

      • MaidrD3
      • useD3Adapter
      // One <g> per distribution, its datum carrying the ladder the rungs
      // were drawn from.
      const result = bindD3Boxen(svgElement, {
      selector: 'g.boxen',
      title: 'Response Time by Group',
      axes: { x: 'Group', y: 'Milliseconds' },
      x: 'group',
      levels: 'letterValues',
      });