||

Legend

Documentation Index

Fetch the complete documentation index at: /llms.txt. Use this file to discover all available pages before exploring further.

Display chart legends to identify different data series in your visualizations

Usage

 
<EvilLineChart
  xDataKey="month"
  data={data}
  chartConfig={chartConfig}
  legendVariant="circle" | "square" | "circle-outline" // and so on
/>

Variants

Control the legend indicator style with the legendVariant prop.

Square

legendVariant='square'

Circle

legendVariant='circle'

Circle Outline

legendVariant='circle-outline'

Rounded Square (Default)

legendVariant='rounded-square'

Rounded Square Outline

legendVariant='rounded-square-outline'

Vertical Bar

legendVariant='vertical-bar'

Horizontal Bar

legendVariant='horizontal-bar'

API Reference
PropTypeDefaultDescription
legendVariantsquare|circle|circle-outline|rounded-square|rounded-square-outline|vertical-bar|horizontal-bar"rounded-square"

Controls the style of the legend indicator icon.

hideLegendbooleanfalse

When true, hides the legend entirely.

hideIconbooleanfalse

When true, hides the color indicator icon next to each legend item. Only the label text is shown.

alignleft|center|right"right"

Controls the horizontal alignment of the legend items.

Did you like the content?