view_program renders a routed TopologicalProgram (produced by
routing) as a self-contained, interactive 3-D
HTML page. All runtime assets are loaded from a CDN, so the output needs no server and can
be opened directly in any browser.
See it in action — a small routed program (S, H, T, RZ, CX on two qubits). Drag to orbit, scroll to zoom, and use the view toggles (top-right):
This viewer is fully interactive — go ahead and play with it! Drag to orbit, scroll to zoom, right-drag to pan, and switch between the surface-code and logical views.
show=True behaviour depends on where you run it:
- In a Jupyter notebook, the viewer is embedded directly in the cell’s output, so you can
rotate and inspect it inline without leaving the notebook.
- Outside a notebook, it opens
output_path in your web browser — so output_path is
required when show=True (otherwise a ClassiqValueError is raised). To just get the HTML
without displaying it, omit show (or pass show=False) and use the returned string.
Focus on a range of cycles (z-axis)
The lattice’s z-axis is time, measured in surface-code cycles. For a tall program this
can be a lot to render at once, so view_program accepts start_cycle and end_cycle to
show only a slice of the circuit along the z-axis — cubes outside [start_cycle, end_cycle)
are hidden, and the window is shifted down so start_cycle becomes the scene’s base.
start_cycle defaults to 0. end_cycle defaults to the program’s total cycle count
(program.stats.cycles), but when left unspecified it is capped to 100 cycles from
start_cycle so a very tall circuit stays manageable — pass end_cycle explicitly to
override.- Windows wider than 2500 cycles are rejected with a
ClassiqValueError; narrow the range
with start_cycle/end_cycle.
Interacting with the viewer
- Orbit: drag · Zoom: scroll · Pan: right-drag.
- Colour modes (top-right toggle):
- Surface-code view (default) colours each cube and pipe by its X/Z boundary type; the
legend maps colours to boundary types.
- Logical view colours each cube by the gate it belongs to; the legend lists the gate
types.
- Camera presets:
- View all frames the entire lattice.
- View layout grid frames the 2-D qubit footprint from above (this is the default pose
when the viewer opens).
- The info panel (top-left) reports the qubit count, layout, node count, and a per-gate
breakdown.
Embed the visualization elsewhere
Because the returned HTML is a self-contained page, you can embed it in your own site or app
with an <iframe> pointing at the saved file:
Next, estimate the total error of the routed
program.
