Go to file

Anton Volnuhin 9b848610ae feat: move legend to top-right box with hover highlighting - Move legend from bottom to vertical top-right box with background - Highlight hovered category in legend (bold text, others dimmed) - Dim legend color swatches to 0.15 opacity for non-hovered items - Make drill-down title larger (22px bold centered) - Reserve right margin (180px) for legend, free up bottom space Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>		2026-02-06 18:11:51 +03:00
altcats-2025-01.csv	drill-down and animation restored	2025-03-22 00:49:27 +03:00
app.js	feat: move legend to top-right box with hover highlighting	2026-02-06 18:11:51 +03:00
DEV.md	Initial	2025-03-19 20:41:30 +03:00
index.html	Add timeline view with stacked bar chart and view switcher	2026-02-06 16:05:48 +03:00
package.json	Initial	2025-03-19 20:41:30 +03:00
README.md	Initial	2025-03-19 20:41:30 +03:00
server.js	automatic months	2026-01-29 13:44:41 +03:00
styles.css	feat: enhance timeline view with drill-down, category highlighting, and native labels	2026-02-06 17:58:08 +03:00

Visual Spending

A visualization tool for family spending data using Apache ECharts.

Features

Visualize spending per categories, subcategories, and microcategories as a sunburst graph
Display spending data for different months
Interactive visualization with hover details and click navigation

Ensure you have Node.js installed on your system
Place your spending data CSV files in the root directory with the naming convention altcats-YYYY-MM.csv
Run the server:

npm start

The CSV file should have the following columns: