Manic API reference
This page is generated from manic-lang’s builtin catalog, the same source used by parsing, editor highlighting, autocomplete, and engine/catalog regression tests. It currently lists 393 builtins across 16 kits.
Run python3 scripts/gen-api.py after changing the catalog. Run python3 scripts/gen-api.py --check to verify that this committed page is current.
Reading a signature
new idis the name created by a constructor.id or tagtargets an existing entity, generated part, or group.- Parameters inside brackets are optional.
…means the builtin is catalogued, but its detailed parameter metadata still lives in the linked topic guide orLANGUAGE.md.- This is the exhaustive name index; the topic chapters remain the best place to learn composition, constraints, and examples.
Standard shapes, styling, and motion
| API | Kind | What it does |
|---|---|---|
circle(id: new id, center: (x, y), r: number) | constructor / setup | a circle |
rect(id: new id, center: (x, y), w: number, h: number) | constructor / setup | a rectangle |
image(id: new id, center: (x, y), path: string, [w: number], [h: number]) | constructor / setup | a raster image (PNG/JPG) from a bundled asset: URI or file path, centred at a point (w×h px) |
svg(id: new id, center: (x, y), path: string, [size: number]) | constructor / setup | import VECTOR artwork from an asset: URI or file path as native path entities (each subpath a traceable Polyline/Polygon), fitted to size px wide and centred; pieces are tagged {id} so draw/show/fade/hue/gradient/move broadcast |
equation(id: new id, center: (x, y), latex: string, [size: number]) | constructor / setup | typeset a LaTeX math string centred at a point; standard \textcolor{cyan}{…} gives individual terms semantic Manic colours that follow the template. Put LaTeX in BACKTICKS; animate with show/fade/move/scale (image, not draw-on) |
line(id: new id, from: (x, y), to: (x, y)) | constructor / setup | a line segment |
link(id: new id, from: id or tag, to: id or tag, [bend: number]) | constructor / setup | a straight or bent edge that follows two moving entities |
arrow(id: new id, from: (x, y), to: (x, y)) | constructor / setup | an arrow |
polygon(…) | constructor / setup | a filled polygon: polygon(id, (x1,y1), (x2,y2), (x3,y3), …, [color]) |
dot(id: new id, at: (x, y), [r: number]) | constructor / setup | a small filled dot |
particles(id: new id, container: id or tag, count: number, [radius: number], [seed: number], [layout: string]) | constructor / setup | deterministic small dots inside a circle or rectangle; optional random/grid/ring layout |
text(id: new id, at: (x, y), text: string) | constructor / setup | a text label |
label(…) | constructor / setup | a label pinned to an entity |
caption(id: new id, words: string, at: (x, y), [size: number], [color: colour]) | constructor / setup | a row of caption words (karaoke/pop) |
support(id: new id, center: (x, y), [len: number], [dir: string]) | constructor / setup | a hatched fixed support (wall/ceiling/floor) for mechanics diagrams; dir = open side |
counter(id: new id, at: (x, y), value: number, [decimals: number], [prefix: string], [suffix: string]) | constructor / setup | a live numeric readout |
parameter(id: new id, at: (x, y), initial: number, min: number, max: number, [label: string], [decimals: number]) | constructor / setup | a visible bounded value for a smooth multi-visual journey |
bind(parameter: id or tag, target: id or tag, property: new id, formula_or_from: string, [to: number], [formula_component_3: string]) | constructor / setup | connect a parameter to a property, plot/field formula, or stable generated 3-D family |
cursor(id: id or tag) | constructor / setup | give a text entity a typewriter cursor |
sticky(id: id or tag) | constructor / setup | pin an entity to the screen so it stays fixed through cam/zoom (HUD overlay) |
morph(…) | constructor / setup | sampled-point shape morph a->b |
invertpath(id: new id, source: id or tag, center: id or tag, radius: number, [samples: number]) | constructor / setup | live whole-outline inversion about a named center |
reflectpath(id: new id, source: id or tag, mirror: id or tag, [samples: number]) | constructor / setup | live whole-outline reflection across a named line |
copy(new: new id, src: id or tag) | constructor / setup | duplicate an entity |
color(id: id or tag, color: colour) | constructor / setup | set fill/stroke colour |
outline(id: id or tag, color: colour) | constructor / setup | set outline colour |
size(id: id or tag, size: number) | constructor / setup | set text size |
wrap(id: id or tag, width: number) | constructor / setup | wrap a text/caption/$…$ label to a width (px), breaking at word boundaries; inline math stays atomic |
stroke(id: id or tag, width: number) | constructor / setup | set stroke width |
dashed(id: id or tag, [dash: number], [gap: number]) | constructor / setup | use a repeating dash/gap stroke on a path-like entity |
gradient(…) | constructor / setup | multi-stop gradient on the primary paint: gradient(id, c1, c2, …, [mode]) — along a path stroke by arc length, a linear (angle°) / radial fill, or a computed “speed”/“curvature” quantity on strokes |
glow(id: id or tag, amount: number) | constructor / setup | set neon glow amount |
opacity(id: id or tag, value: number) | constructor / setup | set opacity 0..1 |
hue(id: id or tag, degrees: number, [s: number], [l: number]) | constructor / setup | drive colour by an HSL hue |
rot(id: id or tag, degrees: number) | constructor / setup | set rotation (degrees) |
z(id: id or tag, z: number) | constructor / setup | set draw order |
clip(id: id or tag, region: id or tag) | constructor / setup | clip an entity (or tagged group) to another entity’s rectangular bounds — reveal-through-a-window / crop-to-panel / region-wipe; the scissor follows the region each frame |
mask(id: id or tag, region: id or tag) | constructor / setup | clip an entity (or tagged group) to another entity’s ARBITRARY shape (circle, polygon, star, an imported svg outline) — reveal-through-any-shape / lens / porthole / spotlight; masks any content and follows the region each frame |
tag(id: id or tag, tag: new id) | constructor / setup | add a group tag |
bold(id: id or tag) | constructor / setup | use the bold mono font |
display(id: id or tag) | constructor / setup | mark visible |
hidden(id: id or tag) | constructor / setup | start hidden (opacity 0) |
filled(id: id or tag) | constructor / setup | turn the fill on |
outlined(id: id or tag) | constructor / setup | turn the outline on |
untraced(id: id or tag) | constructor / setup | start undrawn, ready for draw-on |
union(…) | constructor / setup | boolean union of two shapes |
intersect(…) | constructor / setup | boolean intersection |
intersection(…) | constructor / setup | boolean intersection |
difference(…) | constructor / setup | boolean difference a-b |
subtract(…) | constructor / setup | boolean difference a-b |
exclusion(…) | constructor / setup | boolean symmetric difference |
xor(…) | constructor / setup | boolean symmetric difference |
brace(…) | constructor / setup | a curly brace |
bracelabel(…) | constructor / setup | a brace with a label |
bracetext(…) | constructor / setup | a brace’s text label |
draw(id: id or tag, [dur: number], [ease: easing]) | animation verb | trace a stroke on |
flow(path: id or tag, [dur: number], [direction: id or tag], [mode: id or tag]) | animation verb | send a directional luminous pulse or finite continuous stream over a path |
erase(id: id or tag, [dur: number], [ease: easing]) | animation verb | reverse of draw |
show(id: id or tag, [dur: number]) | animation verb | fade in |
fade(id: id or tag, [dur: number]) | animation verb | fade out |
flash(id: id or tag, [color: colour], [dur: number], [ease: easing]) | animation verb | flash a colour, then restore |
recolor(id: id or tag, color: colour, [dur: number]) | animation verb | permanently change colour |
pulse(id: id or tag, [dur: number]) | animation verb | grow-and-settle attention pulse |
oscillate(id: id or tag, prop: new id, period: number, amp: number, [phase: number], [dur: number]) | animation verb | continuously oscillate a property sinusoidally — prop is size|opacity|x|y|hue; period seconds/cycle; amp is a scale delta (size), opacity delta, pixels (x/y) or degrees (hue); phase in cycles (0–1) — give looped siblings a per-index phase for a travelling wave; runs for dur (default 6s). Works on a tag. |
breathe(id: id or tag, period: number, amp: number, [phase: number], [dur: number]) | animation verb | size oscillation (alias for oscillate with prop=size): the entity grows and shrinks; give looped siblings a per-index phase for a breathing wave |
shake(id: id or tag, [dur: number]) | animation verb | horizontal shake (error gesture) |
spin(id: id or tag, [degrees: number], [dur: number]) | animation verb | spin about the centre |
move(id: id or tag, to: (x, y), [dur: number], [ease: easing]) | animation verb | move to an absolute point |
wander(particles: id or tag, [dur: number]) | animation verb | gently move a particle group inside its source container |
burst(particles: id or tag, [dur: number]) | animation verb | explode a particle group outward from its container centre, decelerating and fading — the impulse/impact/confetti/ignition beat |
arrange(particles: id or tag, container: id or tag, [layout: string], [dur: number], [ease: easing]) | state-changing verb | move persistent particles into a deterministic random, grid, or ring layout; random uses stable organic curved routes |
travel(entity: id or tag, path: id or tag, [dur: number], [ease: easing]) | state-changing verb | move one persistent entity once along an existing path and stop at its endpoint |
attach(child: id or tag, target: id or tag, [offset: (x, y)]) | state-changing verb | keep an entity pinned to another entity plus an optional offset; use target none to release |
become(source: id or tag, target: id or tag, [dur: number], [ease: easing]) | state-changing verb | transform one entity into a declared visual blueprint while retaining the source id |
turn(id_or_tag: id or tag, pivot: (x, y), degrees: number, [dur: number], [ease: easing]) | state-changing verb | rotate one entity or tagged arrangement rigidly around a shared pivot |
disintegrate(entity: id or tag, [dur: number]) | state-changing verb | dissolve an entity’s actual silhouette into deterministic seekable particles |
shift(id: id or tag, by: (x, y), [dur: number], [ease: easing]) | animation verb | move by a delta |
grow(id: id or tag, to: (x, y), [dur: number]) | animation verb | animate a line/arrow endpoint |
scale(id: id or tag, factor: number, [dur: number]) | animation verb | animate scale to a factor |
rotate(id: id or tag, degrees: number, [dur: number], [ease: easing]) | animation verb | animate rotation |
say(id: id or tag, text: string, [dur: number], [ease: easing]) | animation verb | crossfade text to new content |
speak(…) | animation verb | narrate with TTS; service from voice(“gtts”|“cartesia”|“elevenlabs”) (default gTTS); speak(“text”) or speak(caption, “text”); duration is the voice length |
cue(sound: id or tag) | animation verb | play a deterministic procedural sound beat: tick, pop, whoosh, or chime |
rewrite(equation: id or tag, latex: string, [dur: number], [ease: easing]) | state-changing verb | smoothly transform one authored LaTeX equation state into the next while matching unchanged visual parts; this animates supplied math and does not solve it |
type(id: id or tag, [dur: number]) | animation verb | typewriter reveal |
to(id: id or tag, prop: new id, value: number, [dur: number], [ease: easing]) | animation verb | animate any property to a value |
set(id: id or tag, prop: new id, value: number, [dur: number], [ease: easing]) | animation verb | alias of to |
transform(id: id or tag, origin: (x, y), a: number, b: number, c: number, d: number, [dur: number], [ease: easing]) | animation verb | apply a 2x2 matrix (ApplyMatrix) |
swap(a: id or tag, b: id or tag, [dur: number]) | state-changing verb | swap two entities, or array slots i,j |
cycle(…) | state-changing verb | move entities cyclically into one another’s positions along an optional arc |
cam(to: (x, y), [dur: number], [ease: easing]) | animation verb | pan the camera to a point |
zoom(factor: number, [dur: number], [ease: easing]) | animation verb | zoom the camera |
karaoke(…) | animation verb | highlight caption words in sequence |
wordpop(…) | animation verb | pop caption words in one at a time |
Generative
| API | Kind | What it does |
|---|---|---|
lsystem(id: new id, center: (x, y), size: number, axiom: string, rules: string, [options: string]) | constructor / setup | a fitted, batched curve L-system with turtle turns, continuous draw-on, and optional closed concave fill |
repeat(id: new id, motif: id or tag, options: string) | constructor / setup | repeat one entity or tagged motif as a stable hex, grid, or radial arrangement |
ifs2(id: new id, center: (x, y), size: (x, y), count: number, seed: number, rules: string, [options: string]) | constructor / setup | a deterministic batched affine iterated-function system |
mandelbrot(id: new id, center: (x, y), size: (x, y), xrange: (x, y), yrange: (x, y), iterations: number, [columns: number]) | constructor / setup | a batched escape-time Mandelbrot field |
polarpath(id: new id, center: (x, y), scale: number, formula: string, range: (x, y), [samples: number], [closed: number]) | constructor / setup | a sampled polar formula path |
hull2(id: new id, cloud: id or tag, [depth: number], [pivot: number]) | constructor / setup | an onion-depth hull derived from a batched point cloud |
Process
| API | Kind | What it does |
|---|---|---|
livehistogram(id: new id, center: (x, y), min: number, max: number, bins: number, [width: number], [height: number], [color: colour]) | constructor / setup | an initially empty histogram driven by real measurements from a deterministic collection process |
stream(particles: id or tag, path: id or tag, dur: number, [spread: number], [ease: easing]) | state-changing verb | progressively send a persistent particle collection along a path and retain truthful arrival/speed measurements |
emit(particles: id or tag, path: id or tag, profile: id or tag, dur: number, [spread: number], [ease: easing]) | state-changing verb | release a persistent particle collection with deterministic individual speeds sampled from a named profile |
advect(particles: id or tag, field: id or tag, duration: number, [rate: number]) | state-changing verb | move a persistent particle collection through a bounded vector field using deterministic seekable integration |
branch(particles: id or tag, paths: id or tag, dur: number, [ease: easing]) | state-changing verb | send every persistent item through one seeded route in a tagged directed acyclic path network |
collect(histogram: id or tag, particles: id or tag, measurement: id or tag, [dur: number], [ease: easing]) | state-changing verb | catch processed particles in the live-histogram bins selected by their real speed, arrival, outcome, or step measurement |
observe(target: id or tag, particles: id or tag, measurement: id or tag) | animation verb | drive a counter or live histogram from measurements produced by the latest stream, emit, or branch process |
Charts
| API | Kind | What it does |
|---|---|---|
racechart(id: new id, layout: string, periods: string, [title: string]) | constructor / setup | declare an animated race chart: layout “bar” (v1), a period-label list that ticks as it plays, and an optional title; feed rows with racedata, then play with race |
racedata(parent: new id, block: string) | constructor / setup | paste the data for a race chart — one row per entity: label [icon] v0 v1 …; rows split on newline or ;, cells on comma/tab/whitespace; the optional icon is an SVG shorthand (us → a flag) or a full asset path |
raceseries(parent: new id, label: string, icon_or_values: string, [values: string]) | constructor / setup | add ONE entity to a race chart (the per-series sibling of racedata, for the computed/loop path): raceseries(parent, "label", ["icon"], "v0 v1 …") |
raceline(parent: new id, [label: string], [values: string]) | constructor / setup | add a companion LINE across the top of a bar race — a running total (auto-summed from the bars) or an explicit tracked metric: raceline(parent, ["label"], ["v0 v1 …"]) |
racepanel(parent: new id) | constructor / setup | add a multi-line HISTORY panel at the bottom of a bar race — every series drawn as a line up to a moving time-cursor, synced to the race (the classic bar+line combo): racepanel(parent) |
race(parent: new id, [dur: number], [ease: new id]) | animation verb | play the whole race: interpolate each series between periods, re-rank, slide bars to their new slots (the reorder IS the race), rescale to the running max, and tick the period + value counters |
Math
| API | Kind | What it does |
|---|---|---|
axes(id: new id, center: (x, y), halfw: number, halfh: number, [unit: number]) | constructor / setup | a coordinate frame (optional tick spacing in px) |
plot(id: new id, center: (x, y), sx: number, sy: number, formula: function or formula, [domain: number]) | constructor / setup | y = f(x) as a curve |
normal(id: new id, curve: new id, x: number, [len: number]) | constructor / setup | the normal (perpendicular) line to a curve at x |
slope(id: new id, curve: new id, x: number, [offset: (x, y)]) | constructor / setup | a live readout of a curve’s slope at x |
area(id: new id, curve: new id, a: number, b: number, [n: number]) | constructor / setup | the filled region under a curve from a to b |
integral(id: new id, curve: new id, a: number, b: number, [at: (x, y)]) | constructor / setup | a live readout of the integral of a curve from a to b |
roots(id: new id, curve: new id, [color: colour]) | constructor / setup | dots where a curve crosses zero |
deriv(id: new id, curve: new id, [color: colour]) | constructor / setup | the derivative f’ of a curve, drawn as its own curve |
accum(id: new id, curve: new id, [a: number], [color: colour]) | constructor / setup | the accumulation function integral(a..x) of a curve |
extrema(id: new id, curve: new id, [color: colour]) | constructor / setup | dots at a curve’s maxima and minima (slope = 0) |
inflections(id: new id, curve: new id, [color: colour]) | constructor / setup | dots where a curve changes concavity (f’’ = 0) |
band(id: new id, top: new id, bottom: new id, [color: colour]) | constructor / setup | the filled region between two curves |
taylor(id: new id, curve: new id, a: number, n: number, [color: colour]) | constructor / setup | the degree-n Taylor polynomial of a curve about a |
limit(id: new id, curve: new id, a: number, [color: colour]) | constructor / setup | visualise lim(x->a) f(x): the value approached, with an approaching dot |
newton(id: new id, curve: new id, x0: number, [steps: number]) | constructor / setup | Newton’s method zig-zag from a starting guess |
spline(…) | constructor / setup | a smooth curve through a list of points |
trajectory(id: new id, dx/dt: string, dy/dt: string, start: (x, y), center: (x, y), scale: number, [steps: number]) | constructor / setup | an ODE path: dx/dt, dy/dt integrated from a start point |
linmap(id: new id, center: (x, y), unit: number, a: number, b: number, c: number, d: number, [span: number]) | constructor / setup | a 2x2 matrix applied to the plane (grid + basis) |
determinant(id: new id, center: (x, y), unit: number, a: number, b: number, c: number, d: number, [color: colour]) | constructor / setup | the unit square mapped to a parallelogram; area = det |
eigen(id: new id, center: (x, y), unit: number, a: number, b: number, c: number, d: number, [color: colour]) | constructor / setup | a matrix’s real eigenvector directions (with eigenvalues) |
diagonalise(id: new id, center: (x, y), unit: number, a: number, b: number, c: number, d: number, [color: colour]) | constructor / setup | A = P D P^-1: in the eigenbasis the matrix is a pure stretch |
diagonalize(id: new id, center: (x, y), unit: number, a: number, b: number, c: number, d: number, [color: colour]) | constructor / setup | A = P D P^-1: in the eigenbasis the matrix is a pure stretch |
rref(id: new id, data: string, center: (x, y), [cellw: number], [rowh: number]) | constructor / setup | animated Gaussian elimination to reduced row-echelon form |
project(id: new id, center: (x, y), unit: number, b: (x, y), a: (x, y), [color: colour]) | constructor / setup | orthogonal projection of a vector onto a line (subspace) |
leastsquares(id: new id, center: (x, y), unit: number, data: string, [color: colour]) | constructor / setup | the best-fit line through a point cloud (linear regression) |
linsolve(id: new id, center: (x, y), unit: number, a: number, b: number, c: number, d: number, e: number, f: number, [span: number]) | constructor / setup | the row picture of Ax=b: two lines meeting at the solution |
span(id: new id, center: (x, y), unit: number, v: (x, y), [w: (x, y)], [color: colour]) | constructor / setup | the span of one or two vectors (a line, or the whole plane) |
vector(id: new id, origin: (x, y), delta: (x, y), [color: colour]) | constructor / setup | an arrow from an origin |
numberline(…) | constructor / setup | a labelled number line |
numberplane(…) | constructor / setup | a gridded coordinate plane |
plane(…) | constructor / setup | a coordinate plane |
complexplane(…) | constructor / setup | the complex plane |
polarplane(…) | constructor / setup | a polar grid |
matrix(id: new id, data: string, center: (x, y), [colw: number], [rowh: number]) | constructor / setup | a bracketed matrix |
table(id: new id, data: string, center: (x, y), [colw: number], [rowh: number], [cols: string], [rows: string]) | constructor / setup | a ruled table |
mathtable(…) | constructor / setup | a table of math expressions |
integertable(…) | constructor / setup | a table of integers |
decimaltable(…) | constructor / setup | a table of decimals |
arc(…) | constructor / setup | a circular arc |
sector(…) | constructor / setup | a pie sector |
annulus(…) | constructor / setup | a ring / annular sector |
pie(…) | constructor / setup | a pie chart |
arrowfield(…) | constructor / setup | a named or formula-authored bounded vector field |
vectorfield(…) | constructor / setup | a named or formula-authored bounded vector field |
tangent(…) | constructor / setup | tangent line to a curve at x (or tangent points to a circle) |
Systems
| API | Kind | What it does |
|---|---|---|
architecture(id: new id, [center: (x, y)], [width: number], [height: number]) | constructor / setup | an automatically laid-out diagram canvas; geometry is optional and auto-fits the canvas when omitted |
flowchart(id: new id, [direction: id or tag], [max_nodes: number]) | constructor / setup | an edge-ranked flowchart canvas (Mermaid graph TD/LR); with no direction it auto-orients TD/LR to fit and re-decides as nodes are added; reuses the architecture layout/ports/scale-to-fit. Optional max_nodes is the readability split limit (default 6 top-down, 12 left-right) — over it, check warns to split into linked sub-flows |
c4(id: new id, [level: id or tag]) | constructor / setup | a C4-model diagram canvas (Context/Container/Component); inside it node kinds read as C4 elements (person/system/container/component/external) with name/[type: tech]/description |
node(id: new id, parent: id or tag, kind: string, label: string, [description: string], [technology: string]) | constructor / setup | a component inside an architecture/cluster/c4/flowchart; kind is a provider icon, native archetype, flowchart shape, or C4 element. In a c4 diagram the extra args are the box’s description and technology |
cluster(id: new id, parent: id or tag, label: string, [legacy_members: string]) | constructor / setup | a labelled responsive ownership group; children name it as their parent |
connect(id: new id, from: id or tag, to: id or tag, [routing: routing], [from_port: port], [to_port: port]) | constructor / setup | a dashed directed possibility with an optional bend or port-aware orthogonal route |
annotate(edge: id or tag, text: string) | constructor / setup | a small caption at a connection’s midpoint (a decision’s yes/no, or any edge annotation) |
message(id: new id, source: id or tag, label: string) | constructor / setup | a persistent generic message starting at one system node |
request(id: new id, source: id or tag, label: string) | constructor / setup | a persistent labelled request starting at one system node |
route(message: id or tag, connection: id or tag, [duration: number], [ease: easing]) | state-changing verb | move one persistent message through a continuous named connection and illuminate its selected lane |
hotpath(message: id or tag, [duration: number], [seed: number]) | state-changing verb | move one persistent message end-to-end over a seeded valid path, choosing one lane at each fan-out |
Geometry
| API | Kind | What it does |
|---|---|---|
point(id: new id, at: (x, y), [label: string]) | constructor / setup | a labelled point |
segment(id: new id, a: id or tag, b: id or tag) | constructor / setup | segment between two points |
midpoint(id: new id, a: id or tag, b: id or tag) | constructor / setup | midpoint of two points |
centroid(…) | constructor / setup | centroid of a triangle |
circumcenter(…) | constructor / setup | circumcentre |
incenter(…) | constructor / setup | incentre |
orthocenter(…) | constructor / setup | orthocentre |
foot(…) | constructor / setup | foot of a perpendicular |
meet(…) | constructor / setup | line-line intersection |
linecircle(…) | constructor / setup | line-circle intersection |
circlecircle(…) | constructor / setup | circle-circle intersection |
commontangent(id: new id, oA: id or tag, aOn: id or tag, oB: id or tag, bOn: id or tag, [type: string]) | constructor / setup | a common tangent to two circles (each = centre + a point on it): segment {id} between the touch points {id}.a/{id}.b; type external/direct (default) or internal/transverse |
reflect(…) | constructor / setup | reflect a point over a line |
bisector(…) | constructor / setup | angle bisector |
rotpoint(…) | constructor / setup | rotate a point about another |
between(…) | constructor / setup | a point between two others |
anglepoint(…) | constructor / setup | a point at an angle |
circumcircle(…) | constructor / setup | circumscribed circle |
incircle(…) | constructor / setup | inscribed circle |
circle2(…) | constructor / setup | circle from centre + a point on it |
ellipse(…) | constructor / setup | an ellipse |
parabola(…) | constructor / setup | a parabola |
hyperbola(…) | constructor / setup | a hyperbola |
fullline(…) | constructor / setup | an infinite line through two points |
anglemark(…) | constructor / setup | an angle arc mark |
rightangle(…) | constructor / setup | a right-angle square mark |
Algorithms and data structures
| API | Kind | What it does |
|---|---|---|
graph(id: new id, verts: string, edges: string, layout: new id, center: (x, y), scale: number, [radius: number]) | constructor / setup | a node/edge graph (weights via a-b:w) |
array(id: new id, vals: string, center: (x, y), [cw: number], [ch: number]) | constructor / setup | a row of value cells in slot boxes |
list(id: new id, vals: string, center: (x, y), [kind: new id], [cw: number], [ch: number]) | constructor / setup | a linked list (singly/doubly/circular) |
stack(id: new id, center: (x, y), [cw: number], [ch: number]) | constructor / setup | a stack (LIFO, grows up) |
queue(id: new id, center: (x, y), [cw: number], [ch: number]) | constructor / setup | a queue (FIFO, grows right) |
hashmap(id: new id, n: number, center: (x, y), [ew: number], [ch: number]) | constructor / setup | n buckets with separate chaining |
pointer(id: new id, arr: id or tag, slot: number, [label: string]) | constructor / setup | an index caret under an array slot |
caret(id: new id, at: (x, y), label: string, [dir: new id]) | constructor / setup | a labelled triangle marker |
compare(arr: id or tag, i: number, j: number, [color: colour]) | animation verb | flash the values in two array slots |
pointat(id: id or tag, arr: id or tag, slot: number, [dur: number]) | animation verb | slide an index pointer to a slot |
push(id: id or tag, value: string, [dur: number]) | state-changing verb | push onto a stack |
pop(id: id or tag, [dur: number]) | state-changing verb | pop the top of a stack |
enqueue(id: id or tag, value: string, [dur: number]) | state-changing verb | enqueue at the back |
dequeue(id: id or tag, [dur: number]) | state-changing verb | dequeue from the front |
insert(id: id or tag, after: number, value: string, [dur: number]) | state-changing verb | splice a node into a list |
remove(id: id or tag, index: number, [dur: number]) | state-changing verb | unlink a list node |
put(id: id or tag, key: string, val: string, [dur: number]) | state-changing verb | hash a key into a bucket + chain |
get(id: id or tag, key: string, [dur: number]) | animation verb | scan a bucket’s chain for a key |
bfs(g: id or tag, start: id or tag) | state-changing verb | breadth-first traversal (queue) |
dfs(g: id or tag, start: id or tag) | state-changing verb | depth-first traversal (stack) |
dijkstra(g: id or tag, start: id or tag) | state-changing verb | single-source shortest paths |
Grid
| API | Kind | What it does |
|---|---|---|
grid(id: new id, [center: (x, y)], [cols: number], [rows: number], [cellsize: number], [seeded_cellsize: number]) | constructor / setup | a 2D cell grid (arg1 a “# . @ *” spec seeds it, else it is the centre) |
neighbors(id: id or tag, mode: string) | constructor / setup | grid connectivity: “4” (default) or “8” (diagonals) |
setcell(id: id or tag, r: number, c: number, kind: id or tag) | constructor / setup | set one cell’s kind (wall/open/start/goal) |
walls(id: id or tag, cells: string) | constructor / setup | batch-set several cells to wall: “r,c r,c …” |
gridbfs(id: id or tag, start: (x, y), goal: (x, y)) | state-changing verb | unweighted BFS over open cells (spatial sibling of bfs) |
gridastar(id: id or tag, start: (x, y), goal: (x, y), [heuristic: id or tag]) | state-changing verb | A* pathfinding with a heuristic (manhattan/euclidean/diagonal) |
evolve(id: id or tag, rule: string) | constructor / setup | pre-simulate one CA generation (“life” or a Golly rulestring) |
collapse(id: id or tag, tileset: string, [seed: number]) | constructor / setup | pre-simulate a seeded Wave-Function-Collapse settling |
3D
| API | Kind | What it does |
|---|---|---|
camera3(eye: (x, y, z), target: (x, y, z), [fov: number], [projection: id or tag]) | constructor / setup | a Z-up orbit camera |
point3(id: new id, at: (x, y, z), [radius: number]) | constructor / setup | a point in 3D space |
line3(id: new id, from: (x, y, z), to: (x, y, z)) | constructor / setup | a 3D line segment |
arrow3(id: new id, from: (x, y, z), to: (x, y, z)) | constructor / setup | a 3D vector arrow |
cube3(id: new id, center: (x, y, z), size: (x, y, z)) | constructor / setup | a rotatable 3D cuboid |
linmap3(id: new id, center: (x, y, z), a: number, b: number, c: number, d: number, e: number, f: number, g: number, h: number, i: number, [color: colour]) | constructor / setup | a 3x3 matrix deforming the unit cube; volume = determinant |
eigen3(id: new id, center: (x, y, z), a: number, b: number, c: number, d: number, e: number, f: number, g: number, h: number, i: number, [color: colour]) | constructor / setup | the real eigenvector directions of a 3x3 matrix (invariant lines) |
sphere3(id: new id, center: (x, y, z), radius: number) | constructor / setup | a 3D sphere |
collection3(id: new id, center: (x, y, z), count: number, spread: (x, y, z), seed: number, [radius: number]) | constructor / setup | renderer-batched repeated 3D points with stable indexed children |
collection3data(id: new id, center: (x, y, z), points: string, [radius: number]) | constructor / setup | renderer-batched explicit 3D coordinates with stable indexed children |
links3(id: new id, collection: id or tag, mode: id or tag, [neighbors: number]) | constructor / setup | live relationship mesh over a collection3: chain, nearest, or all |
links3data(id: new id, collection: id or tag, edges: string) | constructor / setup | an explicit arbitrary edge list that follows a 3D collection |
trail3(id: new id, collection: id or tag, [child: number], [thickness: number]) | constructor / setup | live history path for one stable indexed child of a collection3 |
ring3(id: new id, collection: id or tag, child: number, [segments: number]) | constructor / setup | live orbit ring derived from one segment of a collection3 chain |
historyplot(id: new id, collection: id or tag, child: number, component: id or tag, center: (x, y), size: (x, y)) | constructor / setup | screen-space 2D component history derived from one compiled collection3 child |
historyplot3(id: new id, collection: id or tag, child: number, component: id or tag, origin: (x, y, z), size: (x, y)) | constructor / setup | world-space 3D component history derived from one compiled collection3 child |
child3(id: new id, collection: id or tag, index: number, [radius: number]) | constructor / setup | addressable proxy for one stable indexed child of a collection3 |
tree3(id: new id, root: (x, y, z), length: number, angle: number, shrink: number, depth: number, seed: number) | constructor / setup | seeded fractal tree batched as one edge mesh per generation |
vectorfield3(id: new id, center: (x, y, z), half: (x, y, z), u: string, v: string, w: string, [density: number]) | constructor / setup | bounded batched 3D vector field from x/y/z/p component formulas |
grid3(id: new id, center: (x, y, z), half: number, [spacing: number]) | constructor / setup | an XY ground grid |
axes3(id: new id, origin: (x, y, z), length: number, [step: number]) | constructor / setup | three colored coordinate axes with ticks + numbers |
frame3(id: new id, center: (x, y, z), size: (x, y, z), [options: string]) | constructor / setup | bounded scientific axes and selectable XY/XZ/YZ grid planes |
randomwalk3(id: new id, center: (x, y, z), steps: number, [seed: number], [options: string]) | constructor / setup | a deterministic batched 3D axis or turtle walk with optional direction color and depth shading |
hilbert3(id: new id, center: (x, y, z), size: number, order: number, [options: string]) | constructor / setup | a bounded batched 3D Hilbert curve that visits every lattice cell once |
present3(frame: id or tag, mode: id or tag, [dur: number], [ease: easing]) | state-changing verb | restyle one frame3 as textbook linework or spatial color |
move3(id: id or tag, to: (x, y, z), [dur: number], [ease: easing]) | animation verb | move a 3D entity |
shift3(id: id or tag, by: (x, y, z), [dur: number], [ease: easing]) | animation verb | shift a 3D entity |
rotate3(id: id or tag, degrees: (x, y, z), [dur: number], [ease: easing]) | animation verb | rotate to Euler angles |
grow3(id: id or tag, to: (x, y, z), [dur: number], [ease: easing]) | animation verb | retarget a 3D line or arrow |
orbit3(azimuth: number, elevation: number, radius: number, [dur: number], [ease: easing]) | animation verb | orbit the 3D camera |
roll3(degrees: number, [dur: number], [ease: easing]) | animation verb | roll the 3D camera around its viewing direction |
look3(target: (x, y, z), [dur: number], [ease: easing]) | animation verb | move the 3D camera target |
drift3(collection: id or tag, dur: number, [amount: number]) | state-changing verb | compile deterministic bounded ambient motion for a collection3 |
chain3(collection: id or tag, lengths: string, rates: string, dur: number) | state-changing verb | animate a generated dependent chain from per-link lengths and rotation rates |
advect3(collection: id or tag, field: id or tag, dur: number, [rate: number]) | state-changing verb | advect a collection3 through a time-varying vectorfield3 with deterministic RK4 |
followshot3(target: id or tag, [offset: (x, y, z)]) | state-changing verb | make the 3D camera target follow an entity, or release with none |
view3(target: id or tag, view: string, [dur: number], [ease: easing], [margin: number]) | state-changing verb | smoothly frame a 3D entity or tagged group from a named view |
travel3(entity: id or tag, path: id or tag, [dur: number], [ease: easing]) | state-changing verb | move a persistent 3D entity along a line, arrow, or curve |
attach3(child: id or tag, target: id or tag, [offset: (x, y, z)], [mode: id or tag]) | state-changing verb | attach one 3D entity to another, or release it with none |
become3(source: id or tag, blueprint: id or tag, [dur: number], [ease: easing]) | state-changing verb | transform a persistent 3D entity into a blueprint |
turn3(target: id or tag, pivot: (x, y, z), axis: id or tag, degrees: number, [dur: number], [ease: easing]) | state-changing verb | turn a 3D entity or tagged group around a world-space pivot and axis |
pin3(label: id or tag, at: (x, y, z), [offset: (x, y)]) | constructor / setup | glue a 2D label to a 3D point with an optional screen-space offset |
follow3(id: id or tag, target: id or tag, [offset: (x, y, z)]) | constructor / setup | track another 3D entity + offset each frame |
midpoint3(id: new id, a: id or tag, b: id or tag) | constructor / setup | a point at the midpoint of two 3D entities |
link3(id: new id, a: id or tag, b: id or tag, [trim: number]) | constructor / setup | a live 3D edge between two moving entities |
project3(id: new id, source: id or tag, plane: string) | constructor / setup | live orthogonal projection of a 3D entity onto xy, xz, or yz |
projectpath3(id: new id, source: id or tag, plane: id or tag) | constructor / setup | live orthogonal projection of a complete changing 3D path |
contour3(id: new id, surface: id or tag, level: number) | constructor / setup | a level curve on a surface3 height field |
label3(label: id or tag, target: id or tag, [world_height: number]) | constructor / setup | projected label with optional world-space height |
curve3(id: new id, x: string, y: string, z: string, [domain: (x, y)]) | constructor / setup | parametric 3D curve from x(t)/y(t)/z(t) formulas |
surface3(id: new id, z: string, xdom: (x, y), ydom: (x, y), [res: number]) | constructor / setup | filled, flat-shaded height-field surface z = f(x,y) |
implicit3(id: new id, formula: string, xdom: (x, y), ydom: (x, y), zdom: (x, y), [level: number], [resolution: number]) | constructor / setup | an isosurface extracted from a bounded 3D scalar field |
lsystem3(id: new id, origin: (x, y, z), step: number, angle: number, iterations: number, axiom: string, rules: string, [max_symbols: number]) | constructor / setup | a bounded deterministic branching 3D turtle grammar |
heightmap3(id: new id, grid: id or tag, z: string, [size: number]) | constructor / setup | lift a 2D grid into a 3D terrain mesh: z(x,y,h), h=cell value |
gradient3(id: new id, surface: new id, x: number, y: number, [color: colour]) | constructor / setup | steepest-ascent arrow on a surface3 at (x,y) |
tangentplane3(id: new id, surface: new id, x: number, y: number, [color: colour]) | constructor / setup | the plane tangent to a surface3 at (x,y) |
volume3(id: new id, surface: new id, [res: number], [color: colour]) | constructor / setup | the volume under a surface3 as a grid of columns |
param3(id: new id, x: string, y: string, z: string, udom: (x, y), vdom: (x, y), [res: number]) | constructor / setup | parametric surface x(u,v),y(u,v),z(u,v) — tori, shells, Möbius |
prism3(id: new id, center: (x, y, z), sides: number, radius: number, height: number) | constructor / setup | regular n-gon prism (many sides ≈ cylinder) |
pyramid3(id: new id, center: (x, y, z), sides: number, radius: number, height: number) | constructor / setup | regular n-gon pyramid (many sides ≈ cone) |
revolve3(id: new id, center: (x, y, z), profile: string, tdom: (x, y), [sides: number]) | constructor / setup | solid of revolution from a radius profile r(t) |
extrude3(id: new id, source: id or tag, height: number, [center: (x, y, z)]) | constructor / setup | extrude a 2D shape or boolean region into a solid prism (CSG) |
morph3(a: id or tag, b: id or tag, [spin: number]) | constructor / setup | set 3D entity a up to morph into b’s shape (animate with to(a, morph, 1, dur)) |
thick(id: id or tag, radius: number) | constructor / setup | render a 3D curve3/line3/arrow3 as a tube of the given world radius |
finish3(id: id or tag, spec: string) | constructor / setup | bounded 3D finish: shading (flat|smooth), material (matte|metal|glass), texture (solid|checker|stripes), scale, mesh, wire (0..1 — render any solid as a bright triangulated WIREFRAME with no filled faces; sphere/cube/prism/pyramid/extrude/surface), depth, shadow |
model3(id: new id, path: string, center: (x, y, z), [scale: number]) | constructor / setup | load deterministic geometry from a bundled asset: URI or safety-limited OBJ path |
assembly3(id: new id, path: string, center: (x, y, z), [scale: number]) | constructor / setup | load grouped OBJ geometry as addressable id.group entities sharing one id tag |
tube3(id: new id, path: id or tag, radius: string, [sides: number]) | constructor / setup | variable-radius tube around a line3, arrow3, or curve3 |
Brand
| API | Kind | What it does |
|---|---|---|
banner(id: new id, center: (x, y), [scale: number]) | constructor / setup | the manic logo/banner |
watermark(id: new id, [at: (x, y)], [text: string]) | constructor / setup | a screen-fixed watermark; omit the point for responsive bottom-right placement or pass an exact point |
Stats
| API | Kind | What it does |
|---|---|---|
histogram(id: new id, center: (x, y), data: string, [bins: number], [width: number], [height: number], [color: colour]) | constructor / setup | bin a dataset into bars — the shape of the data |
summary(id: new id, center: (x, y), data: string, [width: number], [color: colour]) | constructor / setup | describe a dataset: mean/median/mode markers, spread, and readouts |
correlation(id: new id, center: (x, y), unit: number, data: string, [color: colour]) | constructor / setup | scatter + best-fit line + the Pearson correlation r |
skew(id: new id, center: (x, y), data: string, [bins: number], [width: number], [height: number], [color: colour]) | constructor / setup | a histogram labelled with its skewness (left / right / symmetric) |
boxplot(id: new id, center: (x, y), data: string, [width: number], [color: colour]) | constructor / setup | five-number summary as a box-and-whisker (box = IQR) |
hypothesis(id: new id, center: (x, y), z: number, [alpha: number], [unit: number]) | constructor / setup | a two-tailed significance test: p-value as shaded normal tails |
covariance(id: new id, center: (x, y), unit: number, data: string, [color: colour]) | constructor / setup | covariance as signed-area rectangles about the mean cross |
bayes(id: new id, center: (x, y), heads: number, tails: number, [width: number], [height: number]) | constructor / setup | Bayesian updating: prior + likelihood -> posterior for a coin’s bias |
distribution(id: new id, center: (x, y), kind: string, a: number, [b: number], [color: colour]) | constructor / setup | a named distribution: uniform / exponential / maxwell / binomial / poisson |
confidence(id: new id, center: (x, y), mean: number, sd: number, n: number, [level: number], [width: number]) | constructor / setup | a confidence interval for a mean: estimate + z*sd/sqrt(n) error bar |
montecarlo(id: new id, center: (x, y), points: number, [seed: number], [size: number]) | constructor / setup | estimate pi by darts: random points in a square vs the circle |
randomwalk(id: new id, center: (x, y), steps: number, [seed: number], [scale: number]) | constructor / setup | a 2D random walk path from the centre |
bellcurve(id: new id, center: (x, y), mu: number, sigma: number, [unit: number], [color: colour]) | constructor / setup | the normal/Gaussian bell curve with the 68-95-99.7 rule shaded |
gaussian(id: new id, center: (x, y), mu: number, sigma: number, [unit: number], [color: colour]) | constructor / setup | the normal/Gaussian bell curve with the 68-95-99.7 rule shaded |
lln(id: new id, center: (x, y), trials: number, [seed: number], [width: number], [height: number]) | constructor / setup | Law of Large Numbers: a running proportion settling onto the truth |
clt(id: new id, center: (x, y), samplesize: number, trials: number, [seed: number], [width: number], [height: number], [color: colour]) | constructor / setup | Central Limit Theorem: sample means of dice pile into a bell |
Physics
| API | Kind | What it does |
|---|---|---|
freekick(id: new id, center: (x, y), speed: number, angle: number, spin: number, [scale: number], [steps: number]) | constructor / setup | an RK4 free-kick trajectory under drag + the Magnus force (sidespin curves it); draw {id}, run(id) flies the ball |
pendulum(id: new id, [center: (x, y)], [length: number], [angle0: number], [unit: number], [damping: number]) | constructor / setup | a swinging pendulum (pre-simulated); animate with swing(id) |
spring(id: new id, [center: (x, y)], [stiffness: number], [x0: number], [unit: number], [damping: number]) | constructor / setup | a mass on a spring (pre-simulated); animate with run(id) |
doublependulum(id: new id, [center: (x, y)], [angle1: number], [angle2: number], [unit: number]) | constructor / setup | the chaotic double pendulum (pre-simulated); animate with run(id) |
springpendulum(id: new id, [center: (x, y)], [angle0: number], [stretch0: number], [unit: number], [damping: number]) | constructor / setup | an elastic pendulum (swings + bounces); animate with run(id) |
kapitza(id: new id, [center: (x, y)], [angle0: number], [vibeamp: number], [unit: number]) | constructor / setup | a Kapitza pendulum — fast vibration stabilises the inverted position |
cartpendulum(id: new id, [center: (x, y)], [angle0: number], [unit: number]) | constructor / setup | a pendulum on a spring-mounted cart (control-theory system) |
comparependulum(id: new id, [center: (x, y)], [angle0: number], [unit: number]) | constructor / setup | two chaotic pendulums a hair apart — sensitive dependence |
verticalspring(id: new id, [center: (x, y)], [stretch0: number], [unit: number], [damping: number]) | constructor / setup | a mass bobbing on a vertical spring under gravity |
springincline(id: new id, [center: (x, y)], [angle: number], [unit: number], [damping: number]) | constructor / setup | a mass on a spring on an inclined plane |
bungee(id: new id, [center: (x, y)], [unit: number], [damping: number]) | constructor / setup | a bungee jump — free-fall then a one-sided elastic cord |
resonance(id: new id, [center: (x, y)], [drivefreq: number], [unit: number], [damping: number]) | constructor / setup | a driven spring — amplitude peaks near the natural frequency |
doublespring(id: new id, [center: (x, y)], [unit: number]) | constructor / setup | two masses coupled by springs — beating / normal modes |
seriesparallel(id: new id, [center: (x, y)], [unit: number]) | constructor / setup | springs in series vs parallel — soft/slow vs stiff/fast |
carsuspension(id: new id, [center: (x, y)], [unit: number]) | constructor / setup | a quarter-car riding a scrolling road (bump/washboard/pothole) |
piston(id: new id, [center: (x, y)], [rpm: number], [unit: number]) | constructor / setup | an engine piston — a spinning crank drives a slider in a cylinder |
molecule(id: new id, [center: (x, y)], [atoms: number], [unit: number]) | constructor / setup | N atoms bonded by springs, vibrating about their shape |
robotarm(id: new id, [center: (x, y)], [mode: number], [unit: number]) | constructor / setup | a two-link robot arm tracking a target by inverse kinematics (mode 1=circle, 2=figure-8, 0=fixed) |
pulley(id: new id, [center: (x, y)], [m1: number], [m2: number], [unit: number]) | constructor / setup | a vertical Atwood machine — two masses over one pulley |
pulleyscale(id: new id, [center: (x, y)], [m1: number], [m2: number], [unit: number]) | constructor / setup | an Atwood machine with an in-line spring scale reading the rope tension |
blocktackle(id: new id, [center: (x, y)], [load: number], [effort: number], [strands: number], [unit: number]) | constructor / setup | a compound pulley (block & tackle): N strands give a mechanical advantage of N |
compoundpulley(id: new id, [center: (x, y)], [mA: number], [mB: number], [mC: number], [unit: number]) | constructor / setup | a compound pulley: a fixed pulley + a movable pulley with three masses A, B, C (static when mA = mB+mC) |
ramp(id: new id, [center: (x, y)], [angle: number], [mass: number], [applied: number], [unit: number]) | constructor / setup | a block sliding on an inclined plane with friction |
dropmass(id: new id, [center: (x, y)], [dropheight: number], [unit: number]) | constructor / setup | a mass dropped onto a spring-block — inelastic collision, energy lost |
inclinepulley(id: new id, [center: (x, y)], [angle: number], [m1: number], [m2: number], [unit: number]) | constructor / setup | a block on an incline tied over a top pulley to a hanging mass (incline-Atwood) |
doubleincline(id: new id, [center: (x, y)], [angle1: number], [angle2: number], [m1: number], [m2: number], [unit: number]) | constructor / setup | two blocks on a wedge’s two slopes, tied over an apex pulley (right slope rough) |
inclinebumper(id: new id, [center: (x, y)], [angle: number], [mass: number], [stiffness: number], [unit: number]) | constructor / setup | a block slides down an incline into a spring bumper at the base, then bounces back |
springchain(id: new id, [center: (x, y)], [angle: number], [unit: number]) | constructor / setup | three blocks joined by two springs on an incline — coupled oscillators / normal modes |
looptrack(id: new id, [center: (x, y)], [radius: number], [height: number], [unit: number]) | constructor / setup | a ball rolls down a ramp and around a vertical loop-the-loop (curved track) |
collideblocks(id: new id, [center: (x, y)], [m1: number], [m2: number], [restitution: number], [unit: number]) | constructor / setup | two blocks collide on a frictionless track with elastic walls (restitution e) |
bulletblock(id: new id, [center: (x, y)], [bulletmass: number], [speed: number], [blockmass: number], [unit: number]) | constructor / setup | a bullet fired into a block embeds (perfectly inelastic — most kinetic energy lost) |
newtonscradle(id: new id, [center: (x, y)], [balls: number], [pulled: number]) | constructor / setup | Newton’s cradle — pull N balls, N swing out (event-driven elastic collisions) |
stringwave(id: new id, [center: (x, y)], [width: number], [amp: number], [pluck: number]) | constructor / setup | a wave on a plucked string (N masses on springs, fixed ends) — the wave equation |
raft(id: new id, [center: (x, y)], [personmass: number], [raftmass: number], [unit: number]) | constructor / setup | a person walking on a floating raft — centre of mass stays fixed |
brachistochrone(id: new id, [center: (x, y)], [unit: number]) | constructor / setup | four beads race down different curves under gravity — the cycloid wins |
run(id: id or tag, [dur_or_gens: number], [dur: number]) | animation verb | replay a sim’s motion over [dur] s (or a grid’s frames: run(grid, [gens], [dur])) |
swing(id: id or tag, [dur: number]) | animation verb | replay a pendulum’s motion over [dur] seconds (alias of run) |
forces(id: id or tag, [dur: number]) | animation verb | reveal a sim’s free-body force diagram (ramp: gravity, normal, friction, a) |
phase(id: id or tag, center: (x, y), [size: number]) | constructor / setup | a sim’s phase portrait (e.g. θ vs ω); animates with swing |
well(id: id or tag, center: (x, y), [size: number]) | constructor / setup | a sim’s potential-energy well with the body as a rolling ball |
timegraph(id: id or tag, center: (x, y), [size: number]) | constructor / setup | a sim’s phase variables as curves over time (with a sweep line) |
energygraph(id: id or tag, center: (x, y), [size: number]) | constructor / setup | KE/PE/total energy as curves over time (with a sweep line) |
Machine learning
| API | Kind | What it does |
|---|---|---|
network(id: new id, center: (x, y), layers: string, activations: string, [width: number], [height: number], [seed: number]) | constructor / setup | a deterministic feed-forward neural network with responsive layered layout and stable node/edge tags |
activation(id: new id, center: (x, y), function: id or tag, [width: number], [height: number]) | constructor / setup | a truthful plot of linear, ReLU, sigmoid, or tanh |
forward(network: id or tag, input: string, [dur: number], [ease: easing]) | state-changing verb | compute and progressively reveal one feed-forward pass with real activations and output values |
loss(network: id or tag, target: string, [kind: id or tag], [dur: number], [ease: easing]) | state-changing verb | compare the latest network output with a target using cross-entropy or mean-squared error |
backward(network: id or tag, [dur: number], [ease: easing]) | state-changing verb | compute exact reverse-mode gradients and reveal them from output to input |
update(network: id or tag, [learning_rate: number], [dur: number], [ease: easing]) | state-changing verb | apply one gradient-descent parameter update and recompute the prediction and loss |
checkpoint(id: new id, network: id or tag) | state-changing verb | save one network’s exact parameters, prediction, target, and loss for a later rollback |
restore(network: id or tag, checkpoint: id or tag, [dur: number], [ease: easing]) | state-changing verb | animate and exactly restore a checkpointed network state; this is rollback, not dataset-level unlearning |
tensor(id: new id, center: (x, y), values: string, [cell: number], [color: colour]) | constructor / setup | a finite numeric grid; semicolons separate rows and vertical bars separate channels |
kernel(id: new id, center: (x, y), values: string, [cell: number], [color: colour]) | constructor / setup | a finite convolution kernel with one grid per input channel |
convolve(id: new id, input: id or tag, kernel: id or tag, center: (x, y), [stride: number], [padding: number], [bias: number], [activation: id or tag], [cell: number]) | constructor / setup | compute a feature map from an input tensor and kernel with validated stride, padding, bias, and activation |
pool(id: new id, input: id or tag, center: (x, y), kind: id or tag, [window: number], [stride: number], [padding: number], [cell: number]) | constructor / setup | compute deterministic max or average pooling independently across tensor channels |
scan(output: id or tag, [dur: number], [ease: easing]) | state-changing verb | coordinate the receptive field, operator, arithmetic, and destination cell of a convolution or pool |
tokenize(id: new id, center: (x, y), text: string, [mode: id or tag], [width: number]) | constructor / setup | split text into a small deterministic token sequence using authored, word, or character boundaries |
embedding(id: new id, tokens: id or tag, center: (x, y), vectors: string, [position: id or tag], [width: number], [height: number]) | constructor / setup | turn a token sequence into explicit or seeded educational vectors and add sinusoidal or no positional encoding |
transformer(id: new id, embedding: id or tag, center: (x, y), config: string, [width: number], [height: number]) | constructor / setup | compute and draw a complete deterministic transformer block from an ML5 embedding and a compact heads/mask/MLP/norm/dropout specification |
encode(transformer: id or tag, [dur: number], [ease: easing]) | state-changing verb | reveal a transformer block through heads, masking, concatenation, residuals, normalization, MLP, dropout, and output |
logits(id: new id, transformer: id or tag, token: number, center: (x, y), labels: string, [temperature: number], [width: number], [height: number], [seed: number]) | constructor / setup | project one transformer hidden row into an authored educational vocabulary and compute the full temperature-scaled softmax |
sample(logits: id or tag, strategy: string, [dur: number], [ease: easing]) | state-changing verb | filter, renormalize, and deterministically select from a logits view using greedy, categorical, top-k, or top-p decoding |
attention(id: new id, center: (x, y), tokens: string, embeddings: string, [width: number], [height: number], [seed: number]) | constructor / setup | compute and draw one deterministic scaled dot-product self-attention head from explicit token embeddings |
attend(attention: id or tag, token: number, [dur: number], [ease: easing]) | state-changing verb | focus one 1-based query token and reveal its Q/K matches, softmax row, weighted V mix, and residual lane |
topk(id: new id, attention: id or tag, token: number, center: (x, y), labels: string, [k: number], [width: number], [height: number], [seed: number]) | constructor / setup | project one attention residual into an authored candidate vocabulary and draw the exact top-k softmax probabilities |
Optics
| API | Kind | What it does |
|---|---|---|
refract(id: new id, [center: (x, y)], [n1: number], [n2: number], [angle: number]) | constructor / setup | a light ray bending across a boundary (Snell’s law); run(id) sweeps the angle, showing total internal reflection |
lens(id: new id, [center: (x, y)], [focal: number], [aperture: number]) | constructor / setup | a converging lens focusing parallel rays to a focal point; run(id) sweeps the focal length so the focus slides |
prism(id: new id, [center: (x, y)], [glass: string]) | constructor / setup | white light splitting into a spectrum through a prism (real Sellmeier dispersion); run(id) sweeps the incidence angle |
achromat(id: new id, [center: (x, y)], [aperture: number]) | constructor / setup | chromatic aberration (red & blue focus apart) and its fix; run(id) sweeps in the achromatic doublet, merging the foci |
lenssystem(id: new id, [center: (x, y)], [preset: string], [object: number]) | constructor / setup | a real multi-element lens ray-traced through its spherical/aspheric surfaces (named preset OR a custom prescription string); draw(id.rays) sketches rays, run(id) sweeps a focus sensor + spot read-out. Optional finite object distance (px). |
rayfan(id: new id, [center: (x, y)], [preset: string]) | constructor / setup | the ray-fan aberration plot of a lens preset (transverse ray error vs pupil height); draw(id.curve) sketches the spherical-aberration S-curve |
spotdiagram(id: new id, [center: (x, y)], [preset: string]) | constructor / setup | the spot diagram of a lens preset at best focus (rays land in a blur disc — spherical aberration), with an RMS read-out and the ideal point focus |
fieldspot(id: new id, [center: (x, y)], [preset: string], [field: number]) | constructor / setup | the off-axis spot diagram (3-D pupil trace at a field angle) — a coma comet / astigmatic blur off-axis, with an Airy-disk diffraction-limit overlay |
Creator
| API | Kind | What it does |
|---|---|---|
creator(id: new id, spec: string) | constructor / setup | a reusable v2 creator profile: handle/platforms plus name, tagline, logo, palette, footer, CTA and safe-area keys |
socials(id: id or tag, [at: (x, y)]) | constructor / setup | draw the creator profile’s responsive footer; social mode uses normalized native YouTube/X/Instagram/TikTok/Facebook/LinkedIn/GitHub/web/email icons |
quiz(id: new id, question: string, [style: string]) | constructor / setup | start a responsive quiz: studio default; optional skin/reveal/layout/density/labels/timer/pace/seconds/motion/safe/accent controls |
option(id: id or tag, text: string, [correct: id or tag]) | constructor / setup | add one of up to six fitted answer cards with stable A–F semantic tags; a trailing correct marks the right one |
timing(…) | constructor / setup | generic named-phase timing controller (optional position) or quiz-specific pace/phase configuration; use generic controllers with timed/during |
timerstyle(…) | constructor / setup | style a quiz or generic timing controller: optional generic position plus native look, number, direction, size, colours, label and finish |
safezone(id: new id, [inset: number]) | constructor / setup | a responsive safe-area guide; optional numeric inset or shorts/reels/tiktok/clean profile |
countdown(id: new id, [at: (x, y)], [secs: number], [style: string]) | constructor / setup | a standalone Timing v2 widget sharing the quiz timer looks and style controls; play with run(id, secs) |
figure(target: id or tag, [center: (x, y)], [size: (x, y)]) | constructor / setup | fit a complete tagged group into the responsive media region, including text/images/equations and live-dependency checks |
explain(quiz: id or tag, text: string, [source: string]) | constructor / setup | attach optional author-supplied answer context and source to a quiz reveal |
endcard(profile: id or tag, [spec: string]) | constructor / setup | build a hidden responsive creator end card; reveal profile.endcard at the final beat |
Fixed language vocabularies
Colours
fg, void, black, ink, cyan, magenta, lime, gold, red, orange, blue, teal, violet, coral, indigo, mint, dim, panel, rainbow
Easings
linear, smooth, inout, in, out, overshoot, back, bounce, elastic, spring
Named plot functions
sin, cos, tan, asin, arcsin, acos, arccos, atan, arctan, parabola, sq, square, cubic, cube, line, id, identity, abs, exp, sqrt, log, ln, recip, inv, gauss, bell, sinc, sigmoid, logistic, relu, step, heaviside
Canvas presets
16:9, 1080p, 4k, square, portrait, 4:5, 4:3, widescreen, landscape, 720p, fullhd, hd, 2160p, 1:1, 9:16, vertical, story, reel, feed
Templates and aliases
black, mono, plain, terminal, paper, blueprint, shorts, monochrome, blackwhite, black-white, bw, blank, clean, neon, shell, print, light, blue, short, punch
Language keywords
let, for, if, else, def, in, sum, prod, min, max
Reserved variables
w, h, cx, cy, pi, e, tau, inf, infinity
Systems routing and ports
Routing: orthogonal
Ports: auto, left, right, top, bottom
Speech services and curated Cartesia voices
Services: gtts, google, cartesia, elevenlabs, 11labs
Cartesia voices: katie, skylar, jameson, gemma, archie