Skip to content

Interface: DataProps

Props for direct data injection

optional ariaLabel?: string

Accessibility label for screen readers

ChartBaseProps.ariaLabel


optional className?: string

Additional CSS classes

ChartBaseProps.className


optional colorPalette?: ChartColorPalette

Color palette to use. Auto-selected based on chart type if not specified.

  • “categorical”: Distinct colors for different categories (bar, pie, line)
  • “sequential”: Gradient for magnitude/intensity (heatmap)
  • “diverging”: Two-tone for positive/negative values

ChartBaseProps.colorPalette


optional colors?: string[]

Custom colors for series (overrides colorPalette)

ChartBaseProps.colors


data: ChartData

Arrow Table or JSON array


optional format?: undefined


optional height?: number

Chart height in pixels

300

ChartBaseProps.height


optional onDataClick?: (datum) => void

Pointer-only: charts render to , so this does not fire for keyboard users. Provide a keyboard-accessible equivalent (e.g. a table row action) for the same action.

ChartClickDatum

void

ChartBaseProps.onDataClick


optional options?: Record<string, unknown>

Additional ECharts options to merge

ChartBaseProps.options


optional parameters?: undefined


optional queryKey?: undefined


optional selected?: string | string[]

Controlled selection by category name. Matching data element(s) render at full prominence while the rest are dimmed. Drive it from your own state to reflect a cross-filter or selection. Categorical charts (bar, pie/donut) show emphasis; other chart types ignore it.

ChartBaseProps.selected


optional showLegend?: boolean

Show legend

ChartBaseProps.showLegend


optional testId?: string

Test ID for automated testing

ChartBaseProps.testId


optional title?: string

Chart title

ChartBaseProps.title


optional transformer?: undefined


optional valueFormatter?: ChartValueFormatter

Formats measure values in the chart’s built-in value axes, tooltips, and value labels. field is the corresponding yKey, so one formatter can select a different format for each series.

For charts with multiple series on one value axis, axis ticks use the first yKey; each tooltip uses its own series field.

ChartBaseProps.valueFormatter


optional xKey?: string

X-axis field key. Auto-detected from schema if not provided.

ChartBaseProps.xKey


optional yKey?: string | string[]

Y-axis field key(s). Auto-detected from schema if not provided.

ChartBaseProps.yKey