Bubble chart
Bubble Chart
A weighted bubble chart with radial gradient fills, spring scale-in and interactive values.
Bubbles are sized by value and placed from explicit coordinates or a deterministic spiral. Each uses its own radial gradient, scales in once and exposes an accessible label.
Dependencies
framer-motiontailwind-mergetailwind-variants
Interaction type
Hover or focus a bubble to inspect it; click or tap to pin its label and value.
Usage
import { BubbleChart } from "@/registry/new-york-v4/ui/bubble-chart"
<BubbleChart data={segments} />Sales Report
Revenue weight by device segment