MAIDR Documentation - v4.4.0
    Preparing search index...

    Interface D3ViolinConfig

    Configuration for binding a D3 violin plot.

    A violin is d3.area() over the KDE bins, mirrored about each category's centre, so selector matches one <path> per category with that category's bin array bound to it — the same shape D3LineConfig reads off a line path. The box overlay, when the chart draws one, is the per-category <g> D3BoxConfig reads, and is named separately by boxSelector.

    interface D3ViolinConfig {
        id?: string;
        title?: string;
        subtitle?: string;
        caption?: string;
        axes?: { x?: D3AxisInput; y?: D3AxisInput; fill?: D3AxisInput };
        format?: AxisFormat;
        autoApply?: boolean;
        selector: string;
        fill?: DataAccessor<string>;
        kde?: DataAccessor<unknown[]>;
        value?: DataAccessor<number>;
        density?: DataAccessor<number>;
        boxSelector?: string;
        boxRectSelector?: string;
        min?: DataAccessor<number>;
        q1?: DataAccessor<number>;
        q2?: DataAccessor<number>;
        q3?: DataAccessor<number>;
        max?: DataAccessor<number>;
        lowerOutliers?: DataAccessor<number[]>;
        upperOutliers?: DataAccessor<number[]>;
        orientation?: Orientation;
    }

    Hierarchy (View Summary)

    Index

    Properties

    id?: string

    Unique identifier for the chart. Used as the MAIDR id.

    title?: string

    Chart title displayed in text descriptions.

    subtitle?: string

    Chart subtitle.

    caption?: string

    Chart caption.

    axes?: { x?: D3AxisInput; y?: D3AxisInput; fill?: D3AxisInput }

    Axis configuration. Each axis may be provided as either a plain string (shorthand for { label: value }) or a full AxisConfig object (for per-axis format, or grid navigation on scatter).

    For heatmaps and segmented bar charts, use fill for the color/category axis; the binder maps it to the canonical z axis in the MAIDR schema.

    Type Declaration

    format?: AxisFormat

    Optional formatting configuration applied to axes that do not specify their own format. Per-axis format on AxisConfig takes precedence.

    autoApply?: boolean

    When true (the default), the binder writes the generated MAIDR schema to the SVG as a maidr-data attribute so vanilla-JS users don't need to call svg.setAttribute(...) themselves. The returned result is unchanged either way.

    Set to false if you are driving MAIDR yourself — e.g. passing the returned schema to <Maidr data={...}> or persisting it elsewhere. The React adapter (useD3Adapter, MaidrD3) forces this to false internally so it can stay in control of the schema.

    true
    
    selector: string

    CSS selector for the violin outline paths — one per category (e.g. 'path.violin').

    fill?: DataAccessor<string>

    Accessor for the category label.

    'fill'
    
    kde?: DataAccessor<unknown[]>

    Accessor for the array of KDE samples bound to each violin, when the datum is an object wrapping them rather than the array itself.

    'kde', falling back to density, samples, bins or values

    value?: DataAccessor<number>

    Accessor for one KDE sample's position on the value axis.

    'value', falling back to v, y or x

    density?: DataAccessor<number>

    Accessor for one KDE sample's density.

    'density', falling back to estimate, d or count

    boxSelector?: string

    CSS selector for the box overlay's groups, one per category, when the chart draws one. Without it — or when the summary cannot be read — the violin is emitted as its KDE curves alone.

    boxRectSelector?: string

    Selector for the IQR box rectangle within each box group.

    'rect'
    
    min?: DataAccessor<number>

    Accessor for the min value.

    'min'
    
    q1?: DataAccessor<number>

    Accessor for q1 value.

    'q1'
    
    q2?: DataAccessor<number>

    Accessor for median (q2) value.

    'q2'
    
    q3?: DataAccessor<number>

    Accessor for q3 value.

    'q3'
    
    max?: DataAccessor<number>

    Accessor for the max value.

    'max'
    
    lowerOutliers?: DataAccessor<number[]>

    Accessor for lower outlier values.

    'lowerOutliers'
    
    upperOutliers?: DataAccessor<number[]>

    Accessor for upper outlier values.

    'upperOutliers'
    
    orientation?: Orientation

    Chart orientation.

    Orientation.VERTICAL