Charts Legend

The legend tells users which color belongs to which series or slice.

Adjust placement and mark size with legend props, or add a color-bar legend when values map to a continuous scale (see charts-styling and heatmap previews).

  • Multi-series cartesian charts where color alone is ambiguous.
  • Dashboards where users toggle series visibility to reduce clutter.
  • Heatmaps or styled axes that need a color-scale key (continuous legend).
  • Set legend=LegendConfig::default() on any *Chart or ChartContainer.
  • Wire on_legend_click when the parent must react to visibility toggles.
  • Pair with tooltip so hidden series do not leave unexplained colors on the plot.
Series legend with visibility toggles

Click legend entries to show or hide series. highlight_scope pairs with hover fade so the active series stays visually dominant — see charts-highlighting for fade modes.

200k400k600kAmount (USD)Q1Q2Q3Q4Quarter
  • Revenue
  • Cost