Equation.io
equation.io — a graphing calculator with a built-in CAS. Type equations; they compile to GPU shaders and render as 2D curves, 3D surfaces, vector fields, ODE phase portraits, probability densities, and more. Every graph lives entirely in its URL, so the address bar is the share button.
The graph.tk story
This is the successor to graph.tk, which started in this repository in
May 2010 as an HTML5-canvas grapher and picked up 400+ stars over the years.
The site ran on a free .tk domain — which turned out to be the fatal flaw:
the registrar (Freenom) eventually seized the domain to serve ads on it, and
after Meta sued Freenom the whole .tk registry collapsed and the domain
stopped resolving entirely.
The lesson was learned and the grapher was rebuilt from scratch — new parser,
new CAS, WebGL rendering instead of canvas — on a domain that's actually owned:
equation.io. The original code is preserved on the
legacy branch (tag graph.tk-final) under its original
LGPL-3.0 terms; everything on main is a clean-room rewrite, MIT licensed.
The old UI remains usable at graph.equation.io.
Architecture
Deployed as a Cloudflare Worker.
lib/— tokenizer, shunting-yard parser, symbolic expression core (expr.ts),
glsl.ts) used for plotting.
web/— the grapher. Every equation is compiled to a GLSL scalar field F whose
y=tan(x)).
- 3D (automatic when z appears): raymarched implicit surface —
sign-change detection along each ray, bisection refinement,
finite-difference normals, gl_FragDepth so multiple surfaces intersect
correctly. Equations without z extrude to their true locus in R³.
The whole graph state lives in the URL (/g/eq1;eq2;…, each equation
percent-encoded via lib/link.ts, which also escapes parens so chat-app
linkifiers don't truncate the URL; legacy /#… links still load), so any set
of equations is linkable and the address bar is the share mechanism.
Agent-facing surface:
/llms.txt— link format + expression syntax reference
web/public/llms.txt)
/g/— share form of a graph link; the worker injects og:/twitter:
/api/og/ renders the preview PNG on the CPU
(expressions compile to a stack machine — no WebGL in Workers)
/mcp— stateless MCP server (Streamable HTTP) withencode_graph_url
decode_graph_url (decodes links for editing),
and show_graph (renders the interactive grapher inside MCP Apps hosts).
See MCP Apps integration and testing.
Usage
pnpm web # dev server (grapher + worker API)
pnpm test # vitest
pnpm typecheck # lib + web + worker
pnpm web:build # build to dist-web/ (client + worker)
pnpm deploy # build and deploy to CloudflareExamples
Basics
y = x^2·x^2+y^2=4·y = tan(x)— 2D curvesy = sin(2πx)·θ = 1; r = θ x·y = x³— unicode input: π and τ,
T₀ ≡ T_0, so
a₃ is a sequence term), and ·/×/÷/≤/≥/≠;
in the editor, typing \pi, \theta, \nabla, … inserts the symbol, and
\ before any function name just drops (\trail → trail)
z = sin(x)cos(y)·x^2+y^2+z^2=9— 3D surfaces (automatic whenzappears)y < x/2 + 1— inequalities shade their region; strict</>have no
<=/>= draw the boundary line, and chains like
4 <= x^2 + y^2 <= 9 intersect with an edge per non-strict bound
y = {x < 0: -x, x >= 0: x^2}— piecewise:cond: valuecases tried in
{0 < x < 1: 1, 0}
y = {0 < x < 2: x^2}— a domain restriction: with no default, the value
sin(x)cos(y)— a bare expression in x, y is a 2D scalar/density field2+2,sqrt(a),|A - B|— a bare number draws nothing and reads out
= 4 under the row, live with sliders and t; write y = 4 for the line
Sliders and animation
a = 2— a named constant with a slider; other equations can usea, and
b = a^2 + t
defines a computed/animated constant
(2, 3)/(3, 12, 0)— points. In 2D, coordinates that are plain numbers
a = 1; b = 2; (a, b) moves both sliders, (2sin(t), 3) only its literal
height
(2cos(t), 2sin(t))—tis seconds since load, so this point orbits
f(x) = x^3 - a x— user-defined functions, inlined symbolicallyy = d/dx f(x)/d^2/dx^2 (x^4)— symbolic Leibniz derivatives; works for
g(x) = d/dx f(x) then y = f(a) + g(a)(x - a) is a live tangent line
Probability
X ~ Normal(0, a)— a random variable; the row plots its density, and
P(X < b), P(X > b), or P(-1 < X < 2)
shades that area under the density and shows the numeric probability
- Also
Uniform(lo, hi),Exponential(rate),Gamma(shape, rate),Beta(a, b),
ChiSquared(df), StudentT(df) (or T(5)), LogNormal(mu, sigma),
Cauchy(location, scale), Weibull(shape, scale) — exact densities, exact
P(…), and median/IQR readouts where heavy tails leave no σ to report
erf,normalpdf(x, mean, sd), andnormalcdf(x, mean, sd)are also plain
y = normalcdf(x, 0, 1) graphs the CDF
Vector fields and ODEs
(-y, x)— a tuple depending on x, y is a vector field, rendered as
t works too:
(cos(t)-y, x)
grad(x^2 + y^2)(or∇(…)) — the symbolic gradient as a tuple, so it
dot(grad(f), (1, 0))
dy/dx = x y/y' = sin(x) - y— ODEs plot the slope/direction field
(1, f); click the canvas to drop an RK4 integral curve through that point,
double-click to clear
(x', y') = (y, -sin(x))— a system plots its phase portrait, with the same
Simulation (states)
th' = om(angle) withom' = -sin(th)(angular velocity) andth(0) = 3—
lib/state.ts. Everywhere else th behaves exactly like a
constant, uniform and all, so drawing the system is ordinary plotting:
(sin(th), -cos(th)) is the bob, (u sin(th), -u cos(th)) the rod. It is
the one value in a graph that is not a formula in t, which is what makes a
double pendulum — chaotic, no closed form — possible. Initial values get a
slider that relaunches the run; ↻ in the panel restarts it
r' = velwithvel' = -r/|r|^3andr(0) = (1, 0)— a vector state: a
r_1,
r_2(, r_3), and the bare name draws as a moving point and joins point
arithmetic — an orbit in two rows
trail(A)— leaves a live motion trail behind a 2D or 3D point.
A = (cos(t), sin(t)); trail(A) draws an orbit as it runs;
trail((cos(t), sin(t), t/5)) draws a rising helix. Vector states work too.
Trails retain up to 30 seconds / 2048 observed positions, reset when the
equations or simulation restart, and are local to the current session.
Custom coordinates and complex roots
r = sqrt(x^2+y^2); theta = atan2(y,x)defines polar coordinates.
(r, theta) = (2, 9pi/4) draws their point, with angles wrapping modulo 2π.
Use literal or slider values on the right to drag the point in those coordinates.
(r, theta) = (3u, 6pi u)traces a three-turn spiral;
(r', theta') = (r(1-r), 1) draws a polar limit-cycle field.
1+2idraws an Argand point;w^3 = 1draws the three cube roots of unity.
Matrices
M = [(a, b), (c, d)]— a 2×2 or 3×3 matrix;det(M),trace(M), the
M v, and solve(M, v) (Cramer's rule) expand symbolically at
lowering time, see lib/mat.ts. So (x', y') = A (x, y) is a
phase portrait with sliders in the entries, and om' = solve(M, f)
integrates the double pendulum in the Lagrangian form M(θ)ω′ = f it is
derived in
Parametric curves and surfaces
(2cos(2pi u), 2sin(2pi u), 3u)— parametric curve, u ∈ (0,1)(cos(2pi u)(2+cos(2pi v)), sin(2pi u)(2+cos(2pi v)), sin(2pi v))—
Sequences and data
a_n = 1/n^2— a sequence: dots at integer n ≥ 0; the Σ toggle on the row
a_{n+1} = r a_n (1 - a_n)— a recurrence: draws the map's curve, the
a_0 (define a_0 = 0.2
for a slider, default ½). With x free on the right side, x becomes the
parameter axis and the plot is the orbit/bifurcation diagram:
a_{n+1} = x a_n (1 - a_n) is the logistic bifurcation
[3, 1, 4, 1, 5]— a data list: dots at (k, value), k = 1, 2, …; the row's
[(1, 2), (3, 4)] is a scatter of points
Regression
X = [0, 1, 2, 3]; Y = [1, 3, 5, 7]; Y ~ m X + bfits a line.
m and b become fitted constants; y = m x + b draws the
model and (X, Y - (m X + b)) draws its residuals. A fit row reports the
coefficients, RMSE, R² (when defined), and observation count.
Y ~ a X^2 + b X + cfits a polynomial;Y ~ a exp(b X)fits a nonlinear
data.height ~ m data.age + bworks with CSV columns. Missing/nonfinite
- Fits are static, with at most 8 coefficients and 10,000 observations
Contextual syntax help
The equation editor suggests functions, defined names, and loaded CSV columns as you type, and shows signatures inside function calls. Tab or a click inserts a suggestion; arrow keys select one for Enter to insert. Enter otherwise creates an equation row, Escape dismisses help, and completion is one undoable text edit. Comments and quoted strings do not trigger suggestions.
Number theory and complex analysis
gcd(a, b)/isprime(n)— number theory; trya_n = isprime(n)ln(w-2) - ln(w+2)— complex analysis:iis the imaginary unit and
w = x + iy; a complex-valued expression renders the level curves of its
imaginary part (field lines) and real part (equipotentials), so complex
potentials draw electrostatics directly. re/im/arg/abs/conj bring
values back to ℝ, e.g. im(ln(w)) = 1 plots as an ordinary implicit curve
Equations persist in the URL hash. Drag to pan/orbit, wheel to zoom,
right-drag (or shift) to pan in 3D, click a color dot to cycle colors. Points
and dropped ODE seeds highlight under the cursor and drag with it. The
equations panel is a corner-pinned card: flick it — touch anywhere on it, or
drag the grip strip along its top edge with a mouse — to send it to any
corner, or throw it past any edge to clear the view entirely; it tracks the
pointer and leaves along the throw. The y= chip left behind brings it back
(tap it, or drag it to pull the panel in), and the chosen corner sticks.
worker/ — the Cloudflare Worker entry: serves the built app and handles
/api/* routes.
License
MIT — see LICENSE. The pre-2026 graph.tk code on the
legacy branch remains under its original LGPL-3.0
terms; no code from it was reused in the current codebase.
Axis scaling
Option/Alt + drag the 2D canvas to scale each axis independently: horizontal
movement scales x and vertical movement scales y, anchored at the initial
pointer position. Normal zoom preserves the ratio. Set ratio = 1 in the
viewport row to restore equal axis units.
Scaling creates or updates a shareable viewport row:
view(x = -10..10, y = -1..1, ratio = 5). The positive ratio is pixels per
y unit divided by pixels per x unit; omitted means 1. The bounds are fitted
with that ratio preserved, including on different screen sizes.