About Milimetrica
A small web app for plotting (x, y) data on real-feeling graph paper. Built for students and people doing hand-drawn-style lab graphs who need to place points precisely on a millimeter grid.
Why it exists
Students drawing graphs for physics, chemistry, or biology assignments spend a lot of time translating values into millimeters on graph paper — measuring with a ruler, marking each axis, calculating where a point lands when, say, “10 seconds maps to 5 mm.” That work is repetitive but the visual style of graph paper has a pedagogical purpose: it teaches you to think in physical units.
Milimetrica removes the repetitive part while keeping the graph paper look. You enter the values, set the scale, and the app places the points where a ruler would.
What it does
- Real millimeter grid — 1 mm minor, 5 mm medium, and 10 mm major lines, calibrated by stroke weight rather than contrast so the grid feels like real engineer's paper.
- Configurable paper — width and height in mm, both editable with keyboard increment.
- Student-friendly scales — the X and Y scales are expressed as sentences like “10 s = 20 mm on paper” instead of pixels-per-unit.
- Comma-separated input with validation: paste lab data straight in, mismatched lengths or unreadable values surface as inline warnings.
- Dotted projection lines from each point to the X and Y axes — the manual habit of dropping a perpendicular, drawn for you.
- Three connection modes: straight lines through points in input order, linear regression (least-squares best-fit line clipped to the visible plot area), and Modified Gompertz fitting for fermentation and microbial growth curves. See the fermentation example.
- Hover tooltips, auto-fitted origin for negative data, an actionable warning when points don't fit (with a one-click link to grow the paper to the right size), plus Print and PNG export.
- Mobile-friendly: the controls panel collapses into a drawer below 768 px, and the canvas supports pinch-to-zoom and drag-to-pan.
- Persists between sessions via localStorage — your paper size, scale, dataset, and styling are saved automatically.
What it does not do (yet)
- Infinite canvas, pan-and-zoom of an unbounded paper.
- Multi-dataset overlays in the UI (the data model already supports them).
- Spreadsheet-style data editor, CSV import.
- User accounts, cloud sync, sharing.
How it's built
Next.js + React + TypeScript. The canvas is plain SVG with a viewBox in millimeters — no charting library. The grid is rendered as three layered <g> groups (1 mm, 5 mm, 10 mm) so each tier can be styled independently.
The trend line uses a closed-form least-squares solution; the Modified Gompertz fit uses Levenberg-Marquardt with a numerical Jacobian, seeded from the data extremes. Both fitters live in purelib/ modules so they can be unit-tested without a renderer.