BubbleChart

Points placed by two numbers, with a third number as the size of each bubble. Use it to compare items on three measures at once.

Charts need Recharts. Install it once with yarn add recharts, then import from @bolio-ui/core/charts. The package stays out of your bundle until you use a chart.

General

Each point has an x, a y and a z. The z sets the area of the bubble.

Many series and size

sizeRange is the area of the smallest and of the biggest bubble, in square pixels.

APIs

type ScatterSeries = {
  name: string // identifies the series
  label?: string // shown in the legend, `name` when missing
  color?: string // any CSS color, a theme color when missing
  points: Array<{ x: number; y: number; z?: number }>
}