Skip to content

Documentation / @ripl/charts / HeatmapChartOptions

Interface: HeatmapChartOptions<TData> ​

Defined in: charts/src/charts/heatmap.ts:91

Options for configuring a HeatmapChart.

Extends ​

Type Parameters ​

Type ParameterDefault type
TDataunknown

Properties ​

PropertyTypeDescriptionInherited fromDefined in
animation?boolean | Partial<ChartAnimationOptions>Animation configuration, or a boolean toggling all transitions. See ChartAnimationOptions.BaseChartOptions.animationcharts/src/core/chart.ts:128
autoRender?booleanWhether the chart renders automatically on construction and after every Chart.update. Defaults to true.BaseChartOptions.autoRendercharts/src/core/chart.ts:122
axis?ChartAxisInput<TData>Axis configuration for the x and y axes.-charts/src/charts/heatmap.ts:115
borderRadius?numberCorner radius in pixels applied to each cell. Defaults to 2.-charts/src/charts/heatmap.ts:107
dataTData[]The dataset rendered as a grid of cells.-charts/src/charts/heatmap.ts:93
description?stringAccessible description announced by screen readers (sets the rendering element's ARIA label). Defaults to the title text.BaseChartOptions.descriptioncharts/src/core/chart.ts:132
format?ValueFormatInputHow cell values are formatted in the tooltip and legend: a built-in format type, Intl options, or a custom function.-charts/src/charts/heatmap.ts:111
gradient?string[]Color stops (low→high) interpolated across the value extent; also accepts a built-in palette.-charts/src/charts/heatmap.ts:105
keyXkeyof TData | ((item) => string)Accessor for each item's x-axis category.-charts/src/charts/heatmap.ts:95
keyYkeyof TData | ((item) => string)Accessor for each item's y-axis category.-charts/src/charts/heatmap.ts:97
labels?ChartDataLabelsInputShow each cell's value centered in the cell (true/false or detailed label options). Label color auto-contrasts against the cell color. Off by default.-charts/src/charts/heatmap.ts:117
legend?boolean | ColorLegendOptionsGradient color legend showing the value→color scale. Shown by default; pass false to hide, or an options object to customize.-charts/src/charts/heatmap.ts:109
padding?PaddingInputSpace reserved around the chart, in pixels. A single number applies to all four edges; a [top, right, bottom, left] tuple or a partial { top, right, bottom, left } object sets individual edges, leaving unspecified edges at the default. Defaults to 16.BaseChartOptions.paddingcharts/src/core/chart.ts:124
theme?string | ThemeTheme for this chart: a registered name ('light'/'dark'/'auto'), or a Theme. Falls back to the module default (see setDefaultTheme).BaseChartOptions.themecharts/src/core/chart.ts:130
title?string | Partial<ChartTitleOptions>Chart title as plain text, or a ChartTitleOptions object for full control.BaseChartOptions.titlecharts/src/core/chart.ts:126
tooltip?ChartTooltipInputHover tooltip configuration (true/false or detailed tooltip options).-charts/src/charts/heatmap.ts:113
valueNumericAccessor<TData>Accessor for each cell's numeric value (drives its color).-charts/src/charts/heatmap.ts:99
xCategoriesstring[]Ordered list of categories along the x axis.-charts/src/charts/heatmap.ts:101
yCategoriesstring[]Ordered list of categories along the y axis.-charts/src/charts/heatmap.ts:103