Legend
A legend tells what each plot represents. Just like on a map, the legend helps the reader understand what they are looking at. For a line graph for example it tells us what each line represents.
Simple Example
Example with Props
The style and layout of the legend can be customized using a set of props. width and height set the dimensions of the container that wraps the legend, and layout can set the legend to display vertically or horizontally. align and vertical_align set the position relative to the chart container. The type and size of icons can be set using icon_size and icon_type.
ExpandCollapse
API Reference
rx.recharts.Legend
A Legend component in Recharts.
Props
| Prop | Type | Description |
|---|---|---|
width | int | The width of legend container. Number. |
height | int | The height of legend container. Number. |
layout | "vertical""horizontal" | The layout of legend items. 'horizontal' | 'vertical'. |
align | "left""center""right" | The alignment of legend items in 'horizontal' direction, which can be 'left', 'center', 'right'. |
vertical_align | "top""middle""bottom" | The alignment of legend items in 'vertical' direction, which can be 'top', 'middle', 'bottom'. |
icon_size | int | The size of icon in each legend item. |
icon_type | "circle""cross""diamond""line""plainline""rect""square""star""triangle""wye" | The type of icon in each legend item. 'line' | 'plainline' | 'square' | 'rect' | 'circle' | 'cross' | 'diamond' | 'star' | 'triangle' | 'wye'. |
payload | Sequence | The source data of the content to be displayed in the legend, usually calculated internally. |
chart_width | int | The width of chart container, usually calculated internally. |
chart_height | int | The height of chart container, usually calculated internally. |
margin | Dict[str, Any] | The margin of chart container, usually calculated internally. |