# 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:2375 (opens new window)
# display
• display: boolean
Is the legend shown?
Default
true
# Defined in
types/index.d.ts:2365 (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
types/index.d.ts:2388 (opens new window)
# 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 |
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:2407 (opens new window)
# maxHeight
• maxHeight: number
Maximum height of the legend, in pixels
# Defined in
types/index.d.ts:2379 (opens new window)
# maxWidth
• maxWidth: number
Maximum width of the legend, in pixels
# Defined in
types/index.d.ts:2383 (opens new window)
# position
• position: LayoutPosition
Position of the legend.
Default
'top'
# Defined in
types/index.d.ts:2370 (opens new window)
# reverse
• reverse: boolean
Legend will show datasets in reverse order.
Default
false
# Defined in
types/index.d.ts:2393 (opens new window)
# rtl
• rtl: boolean
true for rendering the legends from right to left.
# Defined in
types/index.d.ts:2483 (opens new window)
# 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:2488 (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 | ScriptableAndScriptableOptions<Partial<FontSpec>, ScriptableChartContext> | see Fonts |
padding? | number | ChartArea | - |
position | "center" | "end" | "start" | - |
text | string | The string title. |
# Defined in
types/index.d.ts:2490 (opens new window)
# 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:2397 (opens new window)
# 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:2401 (opens new window)
# 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