↑↓ move · ↵ open · esc close

Point field generator

Type a math expression and see it plotted as a field of points in 3D. The animation on the home page is the first example: a surface that morphs between equations.

StatusShipped
Built withCanvasWebGLMath
Live demo

Loading the demo…

How it works
  • 01Your text is parsed by a small recursive-descent parser into a tree of functions. There is no eval, so only the listed functions and variables can run.
  • 02The surface z = f(x, y, r, th, t) is sampled on an N by N grid. Each sample is rotated, tilted and projected with a simple perspective camera, and drawn as a dot.
  • 03Dots farther from the camera are fainter and smaller, which is what gives the field its depth. Drag to turn it.
What it will include
  • 01An expression box with live parsing and error messages.
  • 02Controls for density, rotation and time.
  • 03Presets: ripples, saddles, waves, attractors.
  • 04Export as an image, an SVG or a short loop.
More in this category
Creative coding and motion

cseen

A small TypeScript library, cseen, that draws 3D figures as SVG from […]

TypeScriptSVG+1