Rose Pie Panel
Rose PiePreview
A Nightingale rose chart (also called a polar area chart) where both the angle and radius of each petal encode the expense amount. Larger spending categories have proportionally larger petals, making relative magnitude immediately visible.
What It Shows
Monthly expenses broken down by category. Each petal represents one expense category. The visual area of each petal is proportional to spending, so the biggest categories are obvious at a glance. Categories are sorted largest-first.
Key Features
- Area-proportional petals -- both angle and radius scale with the value
- Total expenses in header -- formatted as NZD
- Bouncy entry animation -- petals bloom in with a staggered elastic effect on load
- Connecting label lines -- smooth curves linking labels to their petals
Tooltip
Shows a colour dot, category name, NZD amount, and percentage of total expenses.
Interactivity
- Hover -- tooltip with category colour swatch, name, amount, and percentage
- Load animation -- each segment scales in with a bouncy elastic easing and a randomised delay
Empty State
Displays "No spending data" when there are no expenses recorded for the current month.