Bar chart
Activity Waveform Chart
A dense spending waveform with a metric header, hover tooltip and a split ratio bar with legend.
Dozens of thin SVG bars grow from the baseline in a left-to-right wave, while a segmented ratio bar breaks down the total without leaving a value floating by default.
Dependencies
framer-motiontailwind-mergetailwind-variants
Interaction type
Hover or focus any bar to read its value; click or tap to pin it while comparing the split.
Usage
import { ActivityWaveformChart } from "@/registry/new-york-v4/ui/activity-waveform-chart"
<ActivityWaveformChart data={samples} value="−$3,245.00" />Sales activity
This week you spent
−$3,245.00
MonSun
Credit card83%Cash17%