Scatter Plot

Two-dimensional correlation chart. Each point has an x and y value, with an optional per-point label shown in the tooltip.

Examples

series*

ScatterSeries[]

One or more named data series. Each series has a name and data array of { x, y, label? } objects.

colors= palette

string[]

Override chart palette colours.

xLabel= —

string

Label for the x-axis.

yLabel= —

string

Label for the y-axis.

xFormatter= —

(value: number) => string

Format x-axis tick values and tooltip.

yFormatter= —

(value: number) => string

Format y-axis tick values and tooltip.

dotRadius= 5

number

Radius of each data point dot in px.

showLegend= auto

boolean

Show series legend. Auto-shown when series.length > 1.

showGrid= true

boolean

Show a background grid.

height= 300

number

Fixed height of the chart in px.

className= —

string

Extra class on the outer container.

Prop	Type	Default	Description
series*	ScatterSeries[]	—	One or more named data series. Each series has a name and data array of { x, y, label? } objects.
colors	string[]	palette	Override chart palette colours.
xLabel	string	—	Label for the x-axis.
yLabel	string	—	Label for the y-axis.
xFormatter	(value: number) => string	—	Format x-axis tick values and tooltip.
yFormatter	(value: number) => string	—	Format y-axis tick values and tooltip.
dotRadius	number	5	Radius of each data point dot in px.
showLegend	boolean	auto	Show series legend. Auto-shown when series.length > 1.
showGrid	boolean	true	Show a background grid.
height	number	300	Fixed height of the chart in px.
className	string	—	Extra class on the outer container.

name*

string

Series name shown in the legend and tooltip.

data*

{ x: number; y: number; label?: string }[]

Data points. label overrides the series name in the tooltip for that point.

Prop	Type	Default	Description
name*	string	—	Series name shown in the legend and tooltip.
data*	{ x: number; y: number; label?: string }[]	—	Data points. label overrides the series name in the tooltip for that point.