Files

Julien Calixte c361b05ec4 feat(editor): chart behaviour over time with uPlot

Draw the simulation's Stock trajectories with uPlot (ADR-0005): a real time
axis, hover-to-read values, and a playhead-marker hook the canvas animation
drives. SimChart owns the imperative uPlot lifecycle behind a small prop API.

2026-06-20 14:35:35 +02:00

1.8 KiB

Raw Permalink Blame History

meadows

A canvas for thinking in systems — stocks, flows, converters, and feedback loops. Inspired by Donella Meadows' Thinking in Systems.

Deployed at https://meadows.apoena.dev

Design & docs

CONTEXT.md — the ubiquitous language: Stock, Flow, Converter, Information Link, Polarity, and the Feedback Loops (Reinforcing / Balancing) the wiring forms.
DESIGN.md — goal-driven design (QFD): goals → functions → components, the House of Quality, the performance budget, and recorded tradeoffs.
Architecture decisions (docs/adr/):
- ADR-0001 — feedback loops are detected from structure, not stored.
- ADR-0002 — Vue Flow is the editor substrate; the domain Model is the source of truth.
- ADR-0003 — a Flow is a node; Source/Sink clouds are materialised nodes.
- ADR-0004 — simulation behaviour comes from a small fixed vocabulary of rules over Information Links, not free-form formulas.
- ADR-0005 — uPlot draws the behaviour-over-time chart; a charting dependency that earns its keep.

Stack

Vite + Vue 3 + TypeScript, Tailwind v4, DaisyUI. Lint/format via oxc (oxlint + oxfmt). SPA-only — diagram model is client-side.

Develop

pnpm install
pnpm dev           # frontend on :5173
pnpm lint          # oxlint  (pnpm lint:fix to autofix)
pnpm fmt           # oxfmt   (pnpm fmt:check to verify only)
pnpm build         # type-check + production build (what Coolify runs)

Deploy

Pushes to main are picked up by Coolify at https://platform.apoena.dev.