GaugeConfig

Gauge / meter configuration.

Example

new GaugeChart('#chart', {
  min: 0, max: 100,
  segments: [
    { from: 0,  to: 60,  color: '#5b8cff' },
    { from: 60, to: 85,  color: '#ffa45b' },
    { from: 85, to: 100, color: '#ff5b5b' },
  ],
});
chart.setData([72]);

Extends

BaseChartConfig

Properties

animate?

optional animate?: boolean

Defined in: types/index.ts:192

Run an entry animation on the first render and on data updates. Default true.

Inherited from

BaseChartConfig.animate

animDuration?

optional animDuration?: number

Defined in: types/index.ts:194

Animation duration in milliseconds. Default 600.

Inherited from

BaseChartConfig.animDuration

animEasing?

optional animEasing?: EasingName

Defined in: types/index.ts:196

Easing curve. Default 'easeOutCubic'.

Inherited from

BaseChartConfig.animEasing

ariaDescription?

optional ariaDescription?: string

Defined in: types/index.ts:230

Longer accessible description (rendered as canvas aria-description).

Inherited from

BaseChartConfig.ariaDescription

ariaLabel?

optional ariaLabel?: string

Defined in: types/index.ts:228

Accessible label for screen readers (rendered as canvas aria-label).

Inherited from

BaseChartConfig.ariaLabel

formatValue?

optional formatValue?: (value) => string

Defined in: types/index.ts:221

Format a numeric value for axis ticks, tooltips, and labels.

Parameters

value

number

Returns

string

Example

formatValue: (v) => v >= 1000 ? `${(v/1000).toFixed(1)}k` : `${v}`

Inherited from

BaseChartConfig.formatValue

legendPosition?

optional legendPosition?: LegendPosition

Defined in: types/index.ts:208

Where the legend appears relative to the plot. Default 'top'.

Inherited from

BaseChartConfig.legendPosition

max?

optional max?: number

Defined in: types/index.ts:287

Maximum scale value. Default 100.

min?

optional min?: number

Defined in: types/index.ts:285

Minimum scale value. Default 0.

onClick?

optional onClick?: (index, data) => void

Defined in: types/index.ts:226

Click handler invoked with the index of the clicked data point and the resolved data shape so consumers can read the underlying row.

Parameters

index

number

data

ResolvedData

Returns

void

Inherited from

BaseChartConfig.onClick

padding?

optional padding?: Partial<Padding>

Defined in: types/index.ts:200

Override the auto-computed plot area padding (pixels).

Inherited from

BaseChartConfig.padding

responsive?

optional responsive?: boolean

Defined in: types/index.ts:198

Auto-resize when the container size changes via ResizeObserver. Default true.

Inherited from

BaseChartConfig.responsive

segments?

optional segments?: GaugeSegment[]

Defined in: types/index.ts:291

Coloured threshold ranges painted around the arc.

showGrid?

optional showGrid?: boolean

Defined in: types/index.ts:202

Show grid lines on the plot area. Default true.

Inherited from

BaseChartConfig.showGrid

showLegend?

optional showLegend?: boolean

Defined in: types/index.ts:206

Render a legend listing each series. Default true.

Inherited from

BaseChartConfig.showLegend

showTooltip?

optional showTooltip?: boolean

Defined in: types/index.ts:204

Render an interactive tooltip on hover. Default true.

Inherited from

BaseChartConfig.showTooltip

subtitle?

optional subtitle?: string

Defined in: types/index.ts:212

Sub-heading rendered under the title.

Inherited from

BaseChartConfig.subtitle

theme?

optional theme?: Theme | ThemeName

Defined in: types/index.ts:190

Theme name ('midnight' etc.) or a complete Theme object.

Inherited from

BaseChartConfig.theme

title?

optional title?: string

Defined in: types/index.ts:210

Chart heading rendered above the plot.

Inherited from

BaseChartConfig.title

value?

optional value?: number

Defined in: types/index.ts:289

Current value (alternative to setData([value])).