Recipe: Monthly Expenses

Track where your money goes with category breakdowns.

The Result

A stacked bar chart showing expenses by category per month.

Option 1: Inline Data

```dg
type: bar
data:
  source: '[
    {"month": "Jan", "amount": 1200, "category": "Rent"},
    {"month": "Jan", "amount": 450, "category": "Food"},
    {"month": "Jan", "amount": 150, "category": "Transport"},
    {"month": "Jan", "amount": 80, "category": "Entertainment"},
    {"month": "Feb", "amount": 1200, "category": "Rent"},
    {"month": "Feb", "amount": 520, "category": "Food"},
    {"month": "Feb", "amount": 130, "category": "Transport"},
    {"month": "Feb", "amount": 120, "category": "Entertainment"}
  ]'
x: month
y: amount
color: category
stack: true
title: Monthly Expenses
```

Option 2: From CSV

Create data/expenses.csv:

date,amount,category,description
2024-01-05,1200,Rent,Monthly rent
2024-01-08,85,Food,Groceries
2024-01-12,45,Transport,Gas
2024-01-15,120,Food,Restaurants
...

Aggregate by month and category:

```dg
type: bar
data:
  file: data/expenses.csv
transformations:
  - type: derive
    configuration:
      month: "new Date(date).toLocaleString('default', {month: 'short'})"
  - type: aggregate
    configuration:
      groupBy: ["month", "category"]
      sum: ["amount"]
x: month
y: amount_sum
color: category
stack: true
title: Monthly Expenses
```

Alternative Views

Pie chart for single month:

```dg
type: pie
data:
  file: data/expenses.csv
transformations:
  - type: filter
    configuration:
      where:
        date: { contains: "2024-01" }
  - type: aggregate
    configuration:
      groupBy: ["category"]
      sum: ["amount"]
x: category
y: amount_sum
title: January Expenses
```

Trend line per category:

```dg
type: line
data:
  file: data/expenses.csv
transformations:
  - type: aggregate
    configuration:
      groupBy: ["month", "category"]
      sum: ["amount"]
x: month
y: amount_sum
color: category
title: Expense Trends
```

Customizations

Budget comparison (add budget line):

marks:
  - type: bar
  - type: rule
    y: 2000
    stroke: red
    strokeDasharray: "4,4"

Horizontal layout:

horizontal: true