||

Dots

Documentation Index

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

Point markers rendered at each data value along a line or area.

Usage

Compose a <Dot> for the resting marker and an <ActiveDot> for the hover marker inside a <Line> (or <Area>). Each reads the series color and gradient from context.

<EvilLineChart.Line dataKey="desktop">
  <EvilLineChart.Dot variant="border" />
  <EvilLineChart.ActiveDot variant="default" />
</EvilLineChart.Line>

Variants

Control the marker style with the variant prop.

Default

<Dot variant="default" />

Border

<Dot variant="border" />

Colored Border

<Dot variant="colored-border" />

API Reference

Both <Dot> and <ActiveDot> are composed inside a <Line> or <Area>. <Dot> renders the resting marker shown on every data point; <ActiveDot> renders the marker shown on hover.

PropTypeDefaultDescription
variantdefault|border|colored-border"default"

Style of the point marker.

Did you like the content?