3D Surface Plotter
Visualise functions of two variables in real time. Drag to rotate, pinch or scroll to zoom, choose your colour ramp.
Plot a real-valued surface z = f(x, y) as an interactive wireframe. Drag to rotate, pinch / scroll to zoom. Renders entirely in your browser using a 5KB software 3D engine — no WebGL or external library.
What kind of surfaces work?
Any continuous function of two variables. A few of the classics:
sin(√(x² + y²))— the famous radial sinc-like ripple.x² − y²— the saddle (a hyperbolic paraboloid).sin(x)·cos(y)— an egg crate.exp(−(x² + y²)/4)— the bivariate Gaussian.x³ − 3xy²— a "monkey saddle" with three valleys.
How it renders without WebGL
Most 3D web tools use WebGL through a heavy library like Three.js. Loading that machinery costs hundreds of kilobytes and breaks on devices where WebGL is disabled or slow. This plotter does not use WebGL at all. It samples the surface on a configurable grid (default 44×44 = 1936 quads), projects each quad to screen space using a small rotation matrix, sorts them back-to-front by depth, and paints them with Canvas2D. The whole renderer is under 5KB of JavaScript.
Performance tips
If the surface stutters during rotation, drop the mesh resolution to 30. The render time scales with the square of the resolution. On a modern laptop you can comfortably go up to 80 (6400 quads) for static images.