Interface: LegendOptions
- Properties
- Methods

Interface: LegendOptions

Properties

align

• align: start | end | center

Alignment of the legend.

default ‘center’

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

display

• display: boolean

Is the legend shown?

default true

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

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: index.esm.d.ts:2069 (opens new window)

labels

• labels: object

Type declaration:

Name	Type	Description
`boxHeight`	number	Height of the coloured box. `default` fontSize
`boxWidth`	number	Width of colored box. `default` 40
`color`	Color	Color of label `see` Defaults.color
`font`	FontSpec	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
`textAlign`?	TextAlign	Text alignment
`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<bar \| line \| scatter \| bubble \| pie \| doughnut \| polarArea \| radar, (number \| ScatterDataPoint \| BubbleDataPoint)[], unknown>) => boolean	-
`generateLabels`	(`chart`: Chart<bar \| line \| scatter \| bubble \| pie \| doughnut \| polarArea \| radar, (number \| ScatterDataPoint \| BubbleDataPoint)[], unknown>) => LegendItem[]	-
`sort`	(`a`: LegendItem, `b`: LegendItem, `data`: ChartData<bar \| line \| scatter \| bubble \| pie \| doughnut \| polarArea \| radar, (number \| ScatterDataPoint \| BubbleDataPoint)[], unknown>) => number	-

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

position

• position: LayoutPosition

Position of the legend.

default ‘top’

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

reverse

• reverse: boolean

Legend will show datasets in reverse order.

default false

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

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`	FontSpec	see Fonts
`padding`?	number \| ChartArea	-
`position`	start \| end \| center	-
`text`	string	The string title.

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

Methods

onClick

▸ onClick(e: ChartEvent, legendItem: LegendItem, legend: LegendElement): void

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

Parameters:

Name	Type
`e`	ChartEvent
`legendItem`	LegendItem
`legend`	LegendElement

Returns: void

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

onHover

▸ onHover(e: ChartEvent, legendItem: LegendItem, legend: LegendElement): void

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

Parameters:

Name	Type
`e`	ChartEvent
`legendItem`	LegendItem
`legend`	LegendElement

Returns: void

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

onLeave

▸ onLeave(e: ChartEvent, legendItem: LegendItem, legend: LegendElement): void

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

Parameters:

Name	Type
`e`	ChartEvent
`legendItem`	LegendItem
`legend`	LegendElement

Returns: void

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