Go to file
Anton Volnuhin 06fb6bf768 feat: add multi-level drill-down, browser history, and legend filtering to timeline
- Support 3-level drill: category → subcategory → microcategory
- Integrate browser back/forward with drill path and legend selection state
- Cmd-click isolates single series, Opt-click toggles series off
- Dynamic total labels update to reflect only visible series
- Add "Очистить" reset button when series are filtered
- Click month labels to switch to that month's donut view
- Persist timeline drill path in localStorage across reloads

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-06 19:17:05 +03:00
altcats-2025-01.csv drill-down and animation restored 2025-03-22 00:49:27 +03:00
app.js feat: add multi-level drill-down, browser history, and legend filtering to timeline 2026-02-06 19:17:05 +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

Usage

  1. Ensure you have Node.js installed on your system
  2. Place your spending data CSV files in the root directory with the naming convention altcats-YYYY-MM.csv
  3. Run the server:
npm start
  1. Open your browser and navigate to http://localhost:3000

Data Format

The CSV file should have the following columns:

  • transaction_date
  • category
  • subcategory
  • microcategory
  • amount_rub

Technologies Used

  • Apache ECharts
  • Node.js