Beta 2 of Flujo is up. The big one: a Sankey diagram showing the flow of
your money, income sources on the left, expense categories on the right,
with smooth flowing ribbons in between. Drawn on canvas with vanilla JS,
no D3 or any charting library. Just bezierCurveTo and a lot of math.

Also added two more charts: a stacked bar chart showing the last 6 months
(each bar broken down by category, with the monthly total on top), and a
donut chart for the current month’s category breakdown with a legend.

To make the Sankey meaningful I had to add an income system, a small
form where you register your income sources (scholarship, parents, job,
etc.). The balance section now shows five numbers: spent, count, average,
income, and balance (green if positive, red if negative).

The Sankey was the hardest part. My first version drew two separate
bezier curves (top and bottom) and joined them at the ends, the ribbons
looked flat and angular, like triangles. I asked Gemini for help and it
spotted a missing lineTo at the destination node, which fixed the pinch.
But the ribbons still looked off. Turned out the real problem was the
algorithm: each ribbon needs to be ONE single bezierCurveTo with four
control points (not two curves joined), and both sides need to share the
same scale (not normalize independently). Once I fixed that, the ribbons
flowed organically like a real Sankey.

The bar chart had a sneaky bug too: it drew the grid lines but no bars.
Took me a while, I was using canvas.clientWidth (DOM size) instead of
canvas.width (drawing context size). The CSS makes the canvas visually
smaller than its internal resolution, so the bars were being drawn
outside the visible area. Classic canvas gotcha.

Used a muted, desaturated palette for the 8 categories (ochre, dusty
blue, sage green, etc.) instead of bright primary colors, keeps the
editorial aesthetic intact.

Next version will be the OCR ticket scanner, organized in tabs so the
charts don’t compete with the expense list for space. And also redigning the sankey because i dont like how it looks.