RetroSearch Browse

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://www.telerik.com/kendo-react-ui/components/charts/chart/elements/legend below:

React Charts Chart Elements Legend

New to KendoReact? Start a free 30-day trial Legend

Premium

The Chart legend displays the name of the configured data series.

To customize the legend, use the ChartLegend configuration component.

The following example demonstrates how to configure the position and orientation of the Chart legend.

Change Theme

Theme

Loading ...

Hiding the Legend

If you set the series names, the Chart displays a default legend.

The following example demonstrates how to hide the legend by using its visible property.

Change Theme

Theme

Loading ...

Configuring the Legend Items

The Legend Item types and settings are derived from the series configuration. For additional configuration, use the series legendItem property.

The following example shows the different Legend Item types:

Change Theme

Theme

Loading ...

Clicking Legend Items

Clicking the legend items triggers the onLegendItemClick event which can be used to toggle the visibility of the clicked series. When onLegendItemClick is not handled, the Chart itself toggles the series visibility.

Change Theme

Theme

Loading ...

Customizing the Position

You can remove the legend from the flow and absolutely position it by setting the position to custom and configuring the offsetX and offsetY options.

Change Theme

Theme

Loading ...

Setting a Title

The Chart legend section can be configured to hold a title with customizable layout and content. To define a title, use the ChartLegendTitle component.

Change Theme

Theme

Loading ...