# Chart.js - v3.0.2

# Table of contents

# Enumerations

# Classes

# Interfaces

# Type aliases

# AnimationOptions

Ƭ AnimationOptions<TType>: object

# Type parameters:

Name Type
TType ChartType

# Type declaration:

Name Type
animation false | AnimationSpec<TType> & { onComplete?: (this: Chart, event: AnimationEvent) => void ; onProgress?: (this: Chart, event: AnimationEvent) => void }
animations AnimationsSpec<TType>
transitions TransitionsSpec<TType>

Defined in: index.esm.d.ts:1526 (opens new window)


# AnimationSpec

Ƭ AnimationSpec<TType>: object

# Type parameters:

Name Type
TType ChartType

# Type declaration:

Name Type Description
delay? Scriptable<number, ScriptableContext<TType>> Delay before starting the animations. default 0
duration? Scriptable<number, ScriptableContext<TType>> The number of milliseconds an animation takes. default 1000
easing? Scriptable<EasingFunction, ScriptableContext<TType>> Easing function to use default 'easeOutQuart'
loop? Scriptable<boolean, ScriptableContext<TType>> If set to true, the animations loop endlessly. default false

Defined in: index.esm.d.ts:1470 (opens new window)


# AnimationsSpec

Ƭ AnimationsSpec<TType>: object

# Type parameters:

Name Type
TType ChartType

# Type declaration:

Defined in: index.esm.d.ts:1495 (opens new window)


# BarController

Ƭ BarController: DatasetController

Defined in: index.esm.d.ts:133 (opens new window)


# BubbleController

Ƭ BubbleController: DatasetController

Defined in: index.esm.d.ts:161 (opens new window)


# CategoryScale

Ƭ CategoryScale<O>: Scale<O>

# Type parameters:

Name Type Default
O CategoryScaleOptions CategoryScaleOptions

Defined in: index.esm.d.ts:2783 (opens new window)


# CategoryScaleOptions

Ƭ CategoryScaleOptions: CartesianScaleOptions & { labels: string[] | string[][] ; max: string | number ; min: string | number }

Defined in: index.esm.d.ts:2777 (opens new window)


# ChartComponentLike

Ƭ ChartComponentLike: ChartComponent | ChartComponent[] | { [key: string]: ChartComponent; }

Defined in: index.esm.d.ts:1028 (opens new window)


# ChartDataset

Ƭ ChartDataset<TType, TData>: DeepPartial<{ [key in ChartType]: object & ChartTypeRegistry[key]["datasetOptions"]}[TType]> & ChartDatasetProperties<TType, TData>

# Type parameters:

Name Type Default
TType ChartType ChartType
TData - TType[]

Defined in: index.esm.d.ts:3268 (opens new window)


# ChartItem

Ƭ ChartItem: string | CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D | HTMLCanvasElement | OffscreenCanvas | { canvas: HTMLCanvasElement | OffscreenCanvas } | ArrayLike<CanvasRenderingContext2D | HTMLCanvasElement | OffscreenCanvas>

Defined in: index.esm.d.ts:500 (opens new window)


# ChartOptions

Ƭ ChartOptions<TType>: DeepPartial<CoreChartOptions<TType> & ElementChartOptions & PluginChartOptions<TType> & DatasetChartOptions<TType> & ScaleChartOptions<TType> & ChartTypeRegistry[TType][chartOptions]>

# Type parameters:

Name Type Default
TType ChartType ChartType

Defined in: index.esm.d.ts:3250 (opens new window)


# ChartType

Ƭ ChartType: keyof ChartTypeRegistry

Defined in: index.esm.d.ts:3229 (opens new window)


# Color

Ƭ Color: string | CanvasGradient | CanvasPattern

Defined in: color.d.ts:1 (opens new window)


# DatasetChartOptions

Ƭ DatasetChartOptions<TType>: { [key in TType]: object}

# Type parameters:

Name Type Default
TType ChartType ChartType

Defined in: index.esm.d.ts:3238 (opens new window)


# DecimationOptions

Ƭ DecimationOptions: LttbDecimationOptions | MinMaxDecimationOptions

Defined in: index.esm.d.ts:1943 (opens new window)


# DefaultDataPoint

Ƭ DefaultDataPoint<TType>: ChartTypeRegistry[TType][defaultDataPoint][]

# Type parameters:

Name Type
TType ChartType

Defined in: index.esm.d.ts:3259 (opens new window)


# DoughnutDataPoint

Ƭ DoughnutDataPoint: number

Defined in: index.esm.d.ts:294 (opens new window)


# EasingFunction

Ƭ EasingFunction: linear | easeInQuad | easeOutQuad | easeInOutQuad | easeInCubic | easeOutCubic | easeInOutCubic | easeInQuart | easeOutQuart | easeInOutQuart | easeInQuint | easeOutQuint | easeInOutQuint | easeInSine | easeOutSine | easeInOutSine | easeInExpo | easeOutExpo | easeInOutExpo | easeInCirc | easeOutCirc | easeInOutCirc | easeInElastic | easeOutElastic | easeInOutElastic | easeInBack | easeOutBack | easeInOutBack | easeInBounce | easeOutBounce | easeInOutBounce

Defined in: index.esm.d.ts:1437 (opens new window)


# FillTarget

Ƭ FillTarget: number | string | { value: number } | start | end | origin | stack | boolean

Defined in: index.esm.d.ts:1950 (opens new window)


# InteractionMode

Ƭ InteractionMode: keyof InteractionModeMap

Defined in: index.esm.d.ts:695 (opens new window)


# InteractionModeFunction

Ƭ InteractionModeFunction: (chart: Chart, e: ChartEvent, options: InteractionOptions, useFinalPosition?: boolean) => InteractionItem[]

# Type declaration:

▸ (chart: Chart, e: ChartEvent, options: InteractionOptions, useFinalPosition?: boolean): InteractionItem[]

# Parameters:

Name Type
chart Chart
e ChartEvent
options InteractionOptions
useFinalPosition? boolean

Returns: InteractionItem[]

Defined in: index.esm.d.ts:657 (opens new window)


# LayoutPosition

Ƭ LayoutPosition: left | top | right | bottom | center | chartArea | { [scaleId: string]: number; }

Defined in: layout.d.ts:3 (opens new window)


# LineController

Ƭ LineController: DatasetController

Defined in: index.esm.d.ts:205 (opens new window)


# LinearScale

Ƭ LinearScale<O>: Scale<O>

# Type parameters:

Name Type Default
O LinearScaleOptions LinearScaleOptions

Defined in: index.esm.d.ts:2834 (opens new window)


# LinearScaleOptions

Ƭ LinearScaleOptions: CartesianScaleOptions & { beginAtZero: boolean ; suggestedMax?: number ; suggestedMin?: number ; ticks: { count: number ; format: Intl.NumberFormatOptions ; maxTicksLimit: number ; precision: number ; stepSize: number } }

Defined in: index.esm.d.ts:2789 (opens new window)


# LogarithmicScale

Ƭ LogarithmicScale<O>: Scale<O>

# Type parameters:

Name Type Default
O LogarithmicScaleOptions LogarithmicScaleOptions

Defined in: index.esm.d.ts:2859 (opens new window)


# LogarithmicScaleOptions

Ƭ LogarithmicScaleOptions: CartesianScaleOptions & { suggestedMax?: number ; suggestedMin?: number ; ticks: { format: Intl.NumberFormatOptions } }

Defined in: index.esm.d.ts:2840 (opens new window)


# Overrides

Ƭ Overrides: { [key in ChartType]: CoreChartOptions<key> & ElementChartOptions & PluginChartOptions<key> & DatasetChartOptions<ChartType> & ScaleChartOptions<key> & ChartTypeRegistry[key]["chartOptions"]}

Defined in: index.esm.d.ts:635 (opens new window)


# ParsedDataType

Ƭ ParsedDataType<TType>: ChartTypeRegistry[TType][parsedDataType]

# Type parameters:

Name Type Default
TType ChartType ChartType

Defined in: index.esm.d.ts:3261 (opens new window)


# PieAnimationOptions

Ƭ PieAnimationOptions: DoughnutAnimationOptions

Defined in: index.esm.d.ts:313 (opens new window)


# PieController

Ƭ PieController: DoughnutController

Defined in: index.esm.d.ts:317 (opens new window)


# PieControllerChartOptions

Ƭ PieControllerChartOptions: DoughnutControllerChartOptions

Defined in: index.esm.d.ts:312 (opens new window)


# PieControllerDatasetOptions

Ƭ PieControllerDatasetOptions: DoughnutControllerDatasetOptions

Defined in: index.esm.d.ts:311 (opens new window)


# PieDataPoint

Ƭ PieDataPoint: DoughnutDataPoint

Defined in: index.esm.d.ts:315 (opens new window)


# PointStyle

Ƭ PointStyle: circle | cross | crossRot | dash | line | rect | rectRounded | rectRot | star | triangle | HTMLImageElement | HTMLCanvasElement

Defined in: index.esm.d.ts:1706 (opens new window)


# PolarAreaAnimationOptions

Ƭ PolarAreaAnimationOptions: DoughnutAnimationOptions

Defined in: index.esm.d.ts:331 (opens new window)


# RadarController

Ƭ RadarController: DatasetController

Defined in: index.esm.d.ts:380 (opens new window)


# RadarControllerChartOptions

Ƭ RadarControllerChartOptions: LineControllerChartOptions

Defined in: index.esm.d.ts:378 (opens new window)


# RadialLinearScaleOptions

Ƭ RadialLinearScaleOptions: CoreScaleOptions & { angleLines: { borderDash: Scriptable<number[], ScriptableScaleContext> ; borderDashOffset: Scriptable<number, ScriptableScaleContext> ; color: Scriptable<Color, ScriptableScaleContext> ; display: boolean ; lineWidth: Scriptable<number, ScriptableScaleContext> } ; animate: boolean ; beginAtZero: boolean ; grid: GridLineOptions ; max: number ; min: number ; pointLabels: { backdropColor: Scriptable<Color, ScriptableScaleContext> ; backdropPadding: Scriptable<number | ChartArea, ScriptableScaleContext> ; callback: (label: string, index: number) => string ; color: Scriptable<Color, ScriptableScaleContext> ; display: boolean ; font: Scriptable<FontSpec, ScriptableScaleContext> } ; suggestedMax: number ; suggestedMin: number ; ticks: TickOptions & { backdropColor: Scriptable<Color, ScriptableScaleContext> ; backdropPadding: number | ChartArea ; count: number ; format: Intl.NumberFormatOptions ; maxTicksLimit: number ; precision: number ; showLabelBackdrop: Scriptable<boolean, ScriptableScaleContext> ; stepSize: number } }

Defined in: index.esm.d.ts:2956 (opens new window)


# ScaleChartOptions

Ƭ ScaleChartOptions<TType>: object

# Type parameters:

Name Type Default
TType ChartType ChartType

# Type declaration:

Name Type
scales object

Defined in: index.esm.d.ts:3244 (opens new window)


# ScaleOptions

Ƭ ScaleOptions<TScale>: DeepPartial<ScaleOptionsByType<TScale>>

# Type parameters:

Name Type Default
TScale ScaleType ScaleType

Defined in: index.esm.d.ts:3236 (opens new window)


# ScaleOptionsByType

Ƭ ScaleOptionsByType<TScale>: { [key in ScaleType]: object & ScaleTypeRegistry[key]["options"]}[TScale]

# Type parameters:

Name Type Default
TScale ScaleType ScaleType

Defined in: index.esm.d.ts:3231 (opens new window)


# ScaleType

Ƭ ScaleType: keyof ScaleTypeRegistry

Defined in: index.esm.d.ts:3133 (opens new window)


# ScatterController

Ƭ ScatterController: LineController

Defined in: index.esm.d.ts:220 (opens new window)


# ScatterControllerChartOptions

Ƭ ScatterControllerChartOptions: LineControllerChartOptions

Defined in: index.esm.d.ts:218 (opens new window)


# ScatterControllerDatasetOptions

Ƭ ScatterControllerDatasetOptions: LineControllerDatasetOptions

Defined in: index.esm.d.ts:211 (opens new window)


# Scriptable

Ƭ Scriptable<T, TContext>: T | (ctx: TContext) => T

# Type parameters:

Name
T
TContext

Defined in: index.esm.d.ts:28 (opens new window)


# ScriptableAndArray

Ƭ ScriptableAndArray<T, TContext>: readonly T[] | Scriptable<T, TContext>

# Type parameters:

Name
T
TContext

Defined in: index.esm.d.ts:30 (opens new window)


# ScriptableAndArrayOptions

Ƭ ScriptableAndArrayOptions<T, TContext>: { [P in keyof T]: ScriptableAndArray<T[P], TContext>}

# Type parameters:

Name
T
TContext

Defined in: index.esm.d.ts:31 (opens new window)


# ScriptableOptions

Ƭ ScriptableOptions<T, TContext>: { [P in keyof T]: Scriptable<T[P], TContext>}

# Type parameters:

Name
T
TContext

Defined in: index.esm.d.ts:29 (opens new window)


# TextAlign

Ƭ TextAlign: left | center | right

Defined in: index.esm.d.ts:1568 (opens new window)


# TimeScaleOptions

Ƭ TimeScaleOptions: CartesianScaleOptions & { adapters: { date: unknown } ; bounds: ticks | data ; ticks: { source: labels | auto | data } ; time: { displayFormats: { [key: string]: string; } ; isoWeekday: false | number ; minUnit: TimeUnit ; parser: string | (v: unknown) => number ; round: false | TimeUnit ; stepSize: number ; tooltipFormat: string ; unit: false | TimeUnit } }

Defined in: index.esm.d.ts:2865 (opens new window)


# TimeSeriesScale

Ƭ TimeSeriesScale<O>: TimeScale<O>

# Type parameters:

Name Type Default
O TimeScaleOptions TimeScaleOptions

Defined in: index.esm.d.ts:2950 (opens new window)


# TimeUnit

Ƭ TimeUnit: millisecond | second | minute | hour | day | week | month | quarter | year

Defined in: adapters.d.ts:1 (opens new window)


# TooltipXAlignment

Ƭ TooltipXAlignment: left | center | right

Defined in: index.esm.d.ts:2211 (opens new window)


# TooltipYAlignment

Ƭ TooltipYAlignment: top | center | bottom

Defined in: index.esm.d.ts:2212 (opens new window)


# TransitionSpec

Ƭ TransitionSpec<TType>: object

# Type parameters:

Name Type
TType ChartType

# Type declaration:

Name Type
animation AnimationSpec<TType>
animations AnimationsSpec<TType>

Defined in: index.esm.d.ts:1517 (opens new window)


# TransitionsSpec

Ƭ TransitionsSpec<TType>: object

# Type parameters:

Name Type
TType ChartType

# Type declaration:

Defined in: index.esm.d.ts:1522 (opens new window)


# UpdateMode

Ƭ UpdateMode: keyof typeof UpdateModeEnum

Defined in: index.esm.d.ts:519 (opens new window)

# Variables

# ArcElement

ArcElement: ChartComponent & { prototype: ArcElement<ArcProps, ArcOptions> }

Defined in: index.esm.d.ts:1626 (opens new window)


# BarController

BarController: ChartComponent & { prototype: BarController }

Defined in: index.esm.d.ts:134 (opens new window)


# BarElement

BarElement: ChartComponent & { prototype: BarElement<BarProps, BarOptions> }

Defined in: index.esm.d.ts:1856 (opens new window)


# BubbleController

BubbleController: ChartComponent & { prototype: BubbleController }

Defined in: index.esm.d.ts:162 (opens new window)


# CategoryScale

CategoryScale: ChartComponent & { prototype: CategoryScale<CategoryScaleOptions> }

Defined in: index.esm.d.ts:2784 (opens new window)


# DoughnutController

DoughnutController: ChartComponent & { prototype: DoughnutController }

Defined in: index.esm.d.ts:306 (opens new window)


# Element

Element: object

# Type declaration:

Name Type
prototype Element<{}, {}>

Defined in: element.d.ts:27 (opens new window)


# Filler

Const Filler: Plugin

Defined in: index.esm.d.ts:1945 (opens new window)


# Interaction

Const Interaction: object

# Type declaration:

Name Type
modes InteractionModeMap

Defined in: index.esm.d.ts:697 (opens new window)


# Legend

Const Legend: Plugin

Defined in: index.esm.d.ts:1974 (opens new window)


# LineController

LineController: ChartComponent & { prototype: LineController }

Defined in: index.esm.d.ts:206 (opens new window)


# LineElement

LineElement: ChartComponent & { prototype: LineElement<LineProps, LineOptions> }

Defined in: index.esm.d.ts:1696 (opens new window)


# LinearScale

LinearScale: ChartComponent & { prototype: LinearScale<LinearScaleOptions> }

Defined in: index.esm.d.ts:2835 (opens new window)


# LogarithmicScale

LogarithmicScale: ChartComponent & { prototype: LogarithmicScale<LogarithmicScaleOptions> }

Defined in: index.esm.d.ts:2860 (opens new window)


# PieController

PieController: ChartComponent & { prototype: DoughnutController }

Defined in: index.esm.d.ts:318 (opens new window)


# PointElement

PointElement: ChartComponent & { prototype: PointElement<PointProps, PointOptions> }

Defined in: index.esm.d.ts:1807 (opens new window)


# PolarAreaController

PolarAreaController: ChartComponent & { prototype: PolarAreaController }

Defined in: index.esm.d.ts:346 (opens new window)


# RadarController

RadarController: ChartComponent & { prototype: RadarController }

Defined in: index.esm.d.ts:381 (opens new window)


# RadialLinearScale

RadialLinearScale: ChartComponent & { prototype: RadialLinearScale<RadialLinearScaleOptions> }

Defined in: index.esm.d.ts:3101 (opens new window)


# ScatterController

ScatterController: ChartComponent & { prototype: LineController }

Defined in: index.esm.d.ts:221 (opens new window)


# Ticks

Const Ticks: object

# Type declaration:

Name Type
formatters object
formatters.logarithmic [object Object]
formatters.numeric [object Object]
formatters.values [object Object]

Defined in: index.esm.d.ts:1262 (opens new window)


# TimeScale

TimeScale: ChartComponent & { prototype: TimeScale<TimeScaleOptions> }

Defined in: index.esm.d.ts:2945 (opens new window)


# TimeSeriesScale

TimeSeriesScale: ChartComponent & { prototype: TimeSeriesScale<TimeScaleOptions> }

Defined in: index.esm.d.ts:2951 (opens new window)


# Title

Const Title: Plugin

Defined in: index.esm.d.ts:2170 (opens new window)


# Tooltip

Const Tooltip: Plugin & { positioners: { [key: string]: (items: readonly Element[], eventPosition: { x: number ; y: number }) => { x: number ; y: number }; } ; getActiveElements: () => ActiveElement[] ; setActiveElements: (active: ActiveDataPoint[], eventPosition: { x: number ; y: number }) => void }

Defined in: index.esm.d.ts:2263 (opens new window)


# _adapters

Const _adapters: object

# Type declaration:

Name Type
_date DateAdapter

Defined in: adapters.d.ts:61 (opens new window)


# defaults

Const defaults: Defaults

Defined in: index.esm.d.ts:645 (opens new window)


# layouts

Const layouts: object

# Type declaration:

Name Type
addBox (chart: Chart<bar | line | scatter | bubble | pie | doughnut | polarArea | radar, (number | ScatterDataPoint | BubbleDataPoint)[], unknown>, item: LayoutItem) => void
configure (chart: Chart<bar | line | scatter | bubble | pie | doughnut | polarArea | radar, (number | ScatterDataPoint | BubbleDataPoint)[], unknown>, item: LayoutItem, options: { fullSize?: number ; position?: LayoutPosition ; weight?: number }) => void
removeBox (chart: Chart<bar | line | scatter | bubble | pie | doughnut | polarArea | radar, (number | ScatterDataPoint | BubbleDataPoint)[], unknown>, layoutItem: LayoutItem) => void
update (chart: Chart<bar | line | scatter | bubble | pie | doughnut | polarArea | radar, (number | ScatterDataPoint | BubbleDataPoint)[], unknown>, width: number, height: number) => void

Defined in: index.esm.d.ts:701 (opens new window)


# registerables

Const registerables: readonly ChartComponentLike[]

Defined in: index.esm.d.ts:498 (opens new window)


# registry

Const registry: Registry

Defined in: index.esm.d.ts:1054 (opens new window)