DocsGet started
The viewer
What you can do in the diagram.html your agent delivers. It opens offline in any browser, and it is read-only: to change the diagram, ask your agent again.
Try it
This is the viewer, on the diagram from the landing page. Pick a feature to see it, or use the viewer directly; every control works.
stackmap › Architecture
Commerce API
Architecture11 nodes · 11 connectionsSelect a card
Click a card and it stays lit with its direct connections while the rest dims. The inspector shows its details, its connections and the evidence behind it: the file and line it came from. Click a connection to move along it.
ClickselectEscclear
diagram.html#
Share a view
The address keeps what you are looking at, so a link opens the same view, selection, route and playback. Ids the diagram doesn’t have are dropped rather than trusted.
| Parameter | Keeps | Example |
|---|---|---|
view | The open view | #view=checkout |
node | The selected card; the viewer brings it into view | #node=api |
lens | The node types the lens hides, comma-separated | #lens=cache,queue |
route | A route between two nodes | #route=storefront~orders |
play | The flow is playing | #play=1 |
speed | The flow’s speed when it isn’t 1×: 0.5 or 2 | #play=1&speed=0.5 |
Parameters join with &: diagram.html#view=checkout&node=api&play=1.
Present and focus
Press F, or Present in the toolbar, for the stage alone, full screen where the browser allows it. It steps through Overview and then each view: → or Space moves on, ← goes back, Home and End jump to the ends, and Esc leaves.
For the canvas alone without presenting, press Z or Focus in the toolbar. The header, view tabs and inspector step aside and everything on the canvas keeps working, and Z brings them back. H hides the toolbar, in focus or not, and shows it again.
Export
The Export menu in the toolbar saves what the stage shows:
PNGat 1× or 2×, or copied to the clipboardJPEGandWebP, where the browser can encode themSVG- A short video of the flow, in the format your browser records
Keyboard
| Key | Does |
|---|---|
| / | Search nodes, from anywhere but a text field |
| R | Route: pick where it starts, then where it ends |
| P | Play or stop the flow |
| F | Present: the stage alone, stepping through the views |
| Z | Focus: the canvas alone, without the header, tabs or inspector |
| H | Hide or show the toolbar |
| M | Show or hide the minimap |
| Esc | Clear the selection, the search or the route |
| ←↑→↓ | Pan, while the stage has focus |
| +− | Zoom in and out, while the stage has focus |
| 0 | Fit the diagram, while the stage has focus |
| EnterSpace | Select the card that has focus |
| Tab | Move through the cards and every control |
Single keys never fire while you type in a field or from an open menu.
Themes and motion
Dark and light. The viewer starts in your system’s theme and remembers the one you pick from the toolbar. Animations respect reduced motion: with it on, nothing plays.