A height grid
data[j][i] is the height at the i-th x and j-th y sample; each cell becomes one projected quad, shaded by its mean height.
source
<notatio-list-plot-3d data="[[0,1,2,3],[1,3,4,3],[2,4,6,4],[1,2,3,2]]" />3-D data, orthographically projected by <notatio-list-plot-3d>. Two shapes share the element:
type="surface" (the default) — a height grid [[…], […]] drawn as a projected quad mesh (Wolfram's ListPlot3D / ListSurfacePlot3D), shaded by height. Scattered [x, y, z] triples are binned onto an n×n grid first.type="points" — [x, y, z] triples as a 3-D scatter (ListPointPlot3D).The camera is a plain orthographic projection: the data is normalised into the unit cube, rotated by azimuth about the vertical axis, tilted by elevation, and scaled to fit the frame. There is no perspective — depth serves only to order the drawing back-to-front (the painter's algorithm) and, for points, to shrink and fade what's far away. The view is fixed by its attributes, so the figure is a pure function of the markup and renders identically under SSR.
Function surfaces — sampled from an expression, with an interactive drag-to-rotate view — live on Plot 3D.
data[j][i] is the height at the i-th x and j-th y sample; each cell becomes one projected quad, shaded by its mean height.
<notatio-list-plot-3d data="[[0,1,2,3],[1,3,4,3],[2,4,6,4],[1,2,3,2]]" />azimuth rotates about the vertical axis; elevation tilts the view above the floor.
<notatio-list-plot-3d data="[[0,0,0,0,0],[0,1,2,1,0],[0,2,5,2,0],[0,1,2,1,0],[0,0,0,0,0]]" azimuth="55" elevation="35" label="a ridge" />wireframe draws the quad outlines unfilled — useful when the mesh matters more than the shading.
<notatio-list-plot-3d data="[[0,1,2,3],[1,3,4,3],[2,4,6,4],[1,2,3,2]]" wireframe /> A missing sample (null) is a hole: the four quads that touch it are skipped, rather than drawing a spike through zero.
<notatio-list-plot-3d data="[[0,0,0,0,0],[0,1,2,1,0],[0,2,null,2,0],[0,1,2,1,0],[0,0,0,0,0]]" />Markers are drawn back-to-front, shrinking and fading with distance — the only depth cue an orthographic view has.
<notatio-list-plot-3d type="points" data="[[0,0,0],[1,0,1],[0,1,1],[1,1,0],[0.5,0.5,2],[0.2,0.8,0.4],[0.8,0.2,1.6]]" />depth-cue="0" draws every marker at the same size and opacity; size sets the near-marker radius.
<notatio-list-plot-3d type="points" data="[[0,0,0],[1,0,1],[0,1,1],[1,1,0],[0.5,0.5,2],[0.2,0.8,0.4],[0.8,0.2,1.6]]" depth-cue="0" size="5" /> Given triples, the surface form bins them onto an n×n grid — each cell the mean z of the points that land in it, a cell with no points a hole — and meshes that.
<notatio-list-plot-3d data="[[0,0,1],[1,0,2],[2,0,1],[0,1,2],[1,1,4],[2,1,2],[0,2,1],[1,2,2],[2,2,1],[0.4,0.4,1.5],[1.6,1.4,3]]" n="3" /><notatio-plot-3d> has.(x, y, z).