MAIDR Documentation - v3.39.0
    Preparing search index...

    Class ViolinKdeTrace

    Specialized trace for violin plot KDE layers. Overrides navigation so that:

    • Left/Right arrows switch between violins (row changes)
    • Up/Down arrows traverse along the curve (col changes)

    Hierarchy (View Summary)

    Index

    Constructors

    Properties

    observers: Observer<TraceState>[]
    id: string
    type: TraceType
    title: string
    xAxis: string
    yAxis: string
    fill: string
    navigationService: NavigationService
    layer: MaidrLayer
    supportsExtrema: true

    Abstract property that subclasses must implement to indicate extrema support

    rotorSupport: true
    movable: MovableGraph
    points: LinePoint[][]
    lineValues: number[][]
    highlightValues: SVGElement[][] | null
    highlightCenters:
        | {
            x: number;
            y: number;
            row: number;
            col: number;
            element: SVGElement;
        }[]
        | null
    min: number[]
    max: number[]

    Accessors

    • get isInitialEntry(): boolean

      Returns boolean

    • set isInitialEntry(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get isOutOfBounds(): boolean

      Returns boolean

    • set isOutOfBounds(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get values(): number[][]

      Returns number[][]

    • get state(): TraceState

      Get the state for this smooth trace. Overrides the parent state to set plotType to 'smooth' for proper identification in instruction text and layer announcements.

      Returns TraceState

      The trace state with plotType set to 'smooth'

    • get text(): TextState

      Override text() to format display for violin KDE layers:

      • X axis: Shows actual X coordinate value (categorical label if available, otherwise rounded numeric)
      • Y axis: Shows numeric value rounded to 4 decimal places
      • Volume: X-axis difference between points on the same Y value (width of violin at that Y level), rounded to 4 decimals, shown in fill field

      Returns TextState

    • get audio(): AudioState

      Violin KDE layers use a custom, density-based audio mapping:

      • Pitch: derived from density values in the first violin (row 0), so pitch scale is consistent across violins (switching violins doesn't retune).
      • Volume: derived from the current violin's density at the current position, normalized to 0–1 and exposed via volumeScale.

      This mirrors the original violin audio behavior while conforming to the current AudioState shape used by AudioService.

      Returns AudioState

    Methods

    • Gets safe row and column indices to prevent accessing undefined values

      Returns { row: number; col: number }

      Object with safe row and column indices

    • Moves left in rotor mode, optionally filtering by lower or higher values.

      Parameters

      • Optional_mode: "lower" | "higher"

        Optional mode for filtering (lower or higher)

      Returns boolean

      Error always - subclasses must override this method

    • Moves right in rotor mode, optionally filtering by lower or higher values.

      Parameters

      • Optional_mode: "lower" | "higher"

        Optional mode for filtering (lower or higher)

      Returns boolean

      Error always - subclasses must override this method

    • Moves to the nearest point at the specified coordinates (used for hover functionality).

      Parameters

      • x: number

        The x-coordinate

      • y: number

        The y-coordinate

      Returns void

    • Checks if the specified coordinates are within bounds of the element.

      Parameters

      • x: number

        The x-coordinate

      • y: number

        The y-coordinate

      • element: { element: SVGElement; row: number; col: number }

        Object containing the SVG element and its position

        • element: SVGElement

          The SVG element to check bounds against

        • row: number

          The row position of the element

        • col: number

          The column position of the element

      Returns boolean

      True if the point is in bounds, false otherwise

    • Returns { x: number; y: number; row: number; col: number; element: SVGElement }[] | null

    • Parameters

      • x: number
      • y: number

      Returns { element: SVGElement; row: number; col: number } | null

    • Base implementation of navigation in HIGHER and LOWER modes of ROTOR, default is no-op Needs to be implemented in Line, Bar, Heatmap, Candlestick

      Parameters

      • direction: string
      • type: "lower" | "higher"

      Returns boolean

    • Parameters

      • a: number

        Utility function to compare point values for rotor functionality

      • b: number
      • type: "lower" | "higher"

      Returns boolean

      boolean value

    • Moves up in rotor mode, optionally filtering by lower or higher values.

      Parameters

      • Optional_mode: "lower" | "higher"

        Optional mode for filtering (lower or higher)

      Returns boolean

      Error always - subclasses must override this method

    • Moves down in rotor mode, optionally filtering by lower or higher values.

      Parameters

      • Optional_mode: "lower" | "higher"

        Optional mode for filtering (lower or higher)

      Returns boolean

      Error always - subclasses must override this method

    • Maps selectors to SVG elements for violin KDE layers. Supports both old format (single pattern selector) and new format (one selector per violin). Each selector corresponds to one row in the points array.

      Parameters

      • Optionalselectors: string[]

      Returns SVGElement[][] | null

    • Override to return the row index (which violin) for layer switching. For violin KDE layers, row represents the violin index (numeric).

      Returns number | null

      The violin index (row index) as a number, representing which violin is currently active. Returns null if the position is invalid.

    • Override moveToXValue to reset to bottom point (col = 0) when moving to a different violin. This ensures that when navigating to a new violin, we start from the bottom of the curve.

      Parameters

      • xValue: number

      Returns boolean

    • Get the current Y value from the KDE curve. This is used when switching to box plot layer to preserve the Y level.

      Returns number | null

      The current Y value from the KDE curve at the current position (row, col). Returns null if the position is invalid or if no valid Y value can be determined.

    • Move to a specific violin (X value) and find the closest point on the KDE curve with the given Y value. This is used when switching from box plot layer to preserve Y level.

      Parameters

      • xValue: any

        The violin index (X value) to move to. Must be a numeric index. String values are not supported as violin plots use numeric indices.

      • yValue: number

        The Y value to find the closest matching point for on the KDE curve

      Returns boolean

      true if the move was successful (valid violin index and Y value found), false if xValue is not a number or if the violin index is out of bounds

    • Handle switching from another trace. Implements special handling for switching from violin box plot layer to preserve both violin position (X) and Y value.

      Parameters

      • previousTrace: Trace

        The trace we're switching from

      Returns boolean

      true if handled (switching from violin box plot), false otherwise