Scatter Chart plots individual data points on an X/Y axis to reveal correlations and distribution patterns.
Loading demo: scatter-chart-real-world
npx sdaia-ui@latest add scatter
import { Scatter } from "@/components/ui/scatter"<Scatter type="linear" />Props for the Scatter component.
Prop | Type | Default | Required |
|---|---|---|---|
type | 'Linear' | 'Sin' | 'No Trend' | 'Square' | 'Linear' | optional |
title | string | — | optional |
points | ScatterPoint[] | — | optional |
yTicks | string[] | — | optional |
xTicks | string[] | — | optional |
xMin | number | derived from preset | optional |
xMax | number | derived from preset | optional |
yMin | number | derived from preset | optional |
yMax | number | derived from preset | optional |
rtl | boolean | false | optional |
Scatter chart with a linear data distribution.
Loading demo: scatter-linear
Scatter chart following a sinusoidal data pattern.
Loading demo: scatter-chart-sin
Scatter chart with a square/grid data distribution.
Loading demo: scatter-square