Golem
Write equations. Get beautiful graphs.
A declarative graphing engine, published on npm as golem-graph. Describe an equation in plain text and Golem renders a precise, scalable SVG, with grids, labels and adaptive sampling handled for you.
- No Canvas, no D3, no data arrays. Write the equation and Golem does the rest.
- Handles explicit curves, implicit curves such as circles and elliptic curves, and shaded inequality regions.
- Minimal dependencies, built to drop into Markdown and XHTML.
- Used by research students across NUST departments.
The idea
Graphing a function on the web usually means a canvas, a charting library and an array of sampled points. Golem skips all of that. You describe the graph in a few lines of text, the way you would on paper, and it renders a clean SVG.
title: Damped Oscillation
formula: y = e^(-x/4) * cos(3x)
domain: [0, 12]
range: [-1, 1]
style:
stroke: #a29bfe
width: 2.5
Only formula is required. Everything else has a sensible default.
What it understands
- Explicit curves, such as
y = x^3 - 4x, with implicit multiplication and^for powers. - Implicit curves, such as the circle
x^2 + y^2 = 25or the elliptic curvey^2 = x^3 - x + 1. - Shaded regions, such as
y <= sin(x)or a filled discx^2 + y^2 <= 16.
Adaptive sampling, grid lines, axis labels and titles are handled automatically, and the title doubles as the graph's accessible name.
Using it
Two script tags and one div. It is on npm as golem-graph, and the live playground lets you try any equation without installing anything. It is already in use by research students across NUST departments, which is the best kind of feedback: nobody asked me how it works, they just used it.