# Interface: LegendOptions<TType>

# Type parameters

Name Type
TType extends ChartType

# Properties

# align

align: Align

Alignment of the legend.

Default

'center'

# Defined in

types/index.d.ts:2365


# display

display: boolean

Is the legend shown?

Default

true

# Defined in

types/index.d.ts:2355


# fullSize

fullSize: boolean

Marks that this box should take the full width/height of the canvas (moving other boxes). This is unlikely to need to be changed in day-to-day use.

Default

true

# Defined in

types/index.d.ts:2378


# labels

labels: Object

# Type declaration

Name Type Description
borderRadius number Override the borderRadius to use. Default undefined
boxHeight number Height of the coloured box. Default fontSize
boxPadding number Padding between the color box and the text Default 1
boxWidth number Width of colored box. Default 40
color Color Color of label See Defaults.color
font ScriptableAndScriptableOptions<Partial<FontSpec>, ScriptableChartContext> Font of label See Defaults.font
padding number Padding between rows of colored boxes. Default 10
pointStyle PointStyle Override point style for the legend. Only applies if usePointStyle is true
pointStyleWidth number If usePointStyle is true, the width of the point style used for the legend.
textAlign? TextAlign Text alignment
useBorderRadius boolean Label borderRadius will match corresponding borderRadius. Default false
usePointStyle boolean Label style will match corresponding point style (size is based on the minimum value between boxWidth and font.size). Default false
filter (item: LegendItem, data: ChartData<keyof ChartTypeRegistry, (number | [number, number] | Point | BubbleDataPoint)[], unknown>) => boolean Filters legend items out of the legend. Receives 2 parameters, a Legend Item and the chart data
generateLabels (chart: Chart<keyof ChartTypeRegistry, (number | [number, number] | Point | BubbleDataPoint)[], unknown>) => LegendItem[] Generates legend items for each thing in the legend. Default implementation returns the text + styling for the color box. See Legend Item for details.
sort (a: LegendItem, b: LegendItem, data: ChartData<keyof ChartTypeRegistry, (number | [number, number] | Point | BubbleDataPoint)[], unknown>) => number Sorts the legend items

# Defined in

types/index.d.ts:2397


# maxHeight

maxHeight: number

Maximum height of the legend, in pixels

# Defined in

types/index.d.ts:2369


# maxWidth

maxWidth: number

Maximum width of the legend, in pixels

# Defined in

types/index.d.ts:2373


# position

position: LayoutPosition

Position of the legend.

Default

'top'

# Defined in

types/index.d.ts:2360


# reverse

reverse: boolean

Legend will show datasets in reverse order.

Default

false

# Defined in

types/index.d.ts:2383


# rtl

rtl: boolean

true for rendering the legends from right to left.

# Defined in

types/index.d.ts:2478


# textDirection

textDirection: string

This will force the text direction 'rtl' or 'ltr' on the canvas for rendering the legend, regardless of the css specified on the canvas

Default

canvas's default

# Defined in

types/index.d.ts:2483


# title

title: Object

# Type declaration

Name Type Description
color Color Color of title See Defaults.color
display boolean Is the legend title displayed. Default false
font ScriptableAndScriptableOptions<Partial<FontSpec>, ScriptableChartContext> see Fonts
padding? number | ChartArea -
position "center" | "end" | "start" -
text string The string title.

# Defined in

types/index.d.ts:2485

# Methods

# onClick

onClick(this, e, legendItem, legend): void

A callback that is called when a click event is registered on a label item.

# Parameters

Name Type
this LegendElement<TType>
e ChartEvent
legendItem LegendItem
legend LegendElement<TType>

# Returns

void

# Defined in

types/index.d.ts:2387


# onHover

onHover(this, e, legendItem, legend): void

A callback that is called when a 'mousemove' event is registered on top of a label item

# Parameters

Name Type
this LegendElement<TType>
e ChartEvent
legendItem LegendItem
legend LegendElement<TType>

# Returns

void

# Defined in

types/index.d.ts:2391


# onLeave

onLeave(this, e, legendItem, legend): void

A callback that is called when a 'mousemove' event is registered outside of a previously hovered label item.

# Parameters

Name Type
this LegendElement<TType>
e ChartEvent
legendItem LegendItem
legend LegendElement<TType>

# Returns

void

# Defined in

types/index.d.ts:2395