<notatio-polytope>
<notatio-polytope which="permutahedron" n="4"> -- a polytope's face poset, drawn, draggable and clickable.
Every mark on the picture IS a face: clicking a polygon selects a 2-face, a line a 1-face, a dot a 0-face. Selection follows face identity rather than screen position, which is what makes it survive two faces landing on the same pixels -- the SVG generator writes each face's own data into data-face, so the handler never has to consult geometry to know what was hit.
Clicking REPLACES the selection and shift-clicking extends it, which is the convention everywhere else a list can be selected from. recentre brings the selection to the middle of the figure and reorient turns it to face the viewer.
The picture is a pure function of the attributes, so it renders identically under SSR. The live parts -- the drag and the click -- both work by writing attributes back.
Attributes
| Attribute | Type | Default | Notes |
|---|---|---|---|
which | string | "permutahedron" | |
n | number | 4 | |
selected | string | "" | reflects |
dimension | number | -1 | |
labels | string | "selected" | |
label-form property labelForm | string | "data" | |
recentre | string | "false" | |
reorient | string | "false" | |
shade | string | "true" | |
azimuth | number | 30 | |
elevation | number | 25 | |
zoom | number | 1 | |
label | string | "" |