containerlab paste → graph (network-xray gallery)

Paste a containerlab topology (.clab.yml) and press Render. Nodes are laid out from their graph-posX/graph-posY labels (edit them and the graph moves); a lab without those labels falls back to an automatic layout. Click any node to look inside the router — OSPF/BGP adjacencies and the LSDB.
Scope: this browser preview maps small labs (2–3 nodes: link / path / triangle); the recorded demos and the containerlab NeXt UI graph handle larger topologies.
🔒 Runs entirely in your browser — your topology never leaves the page.

containerlab topology (clab.yml)

Render the pasted topology input is JSON target drag a node to reposition it → the graph-posX/posY above updates

// clab-to-xray.js parses your topology (incl. graph-posX/posY) → X-Ray config:
var r    = clabToXray.convert(clabYamlText);   // { ok, config }  — config.positions from graph-pos
// nodes are placed at config.positions (or an auto layout); click a node → its DeepDive:
var views = clabXray.deepViews(config, nodeId);      // one scene with all of the node's links (positions carried)
xrayCore.openDeepDiveFor(nodeId, state);             // inside the router (angles follow the coords)

Layout: nodes use graph-posX/graph-posY when present, else an automatic hub/ring layout. IP/subnets are synthesized (10.x.0.0/24); real clab IPs would come from containerlab inspect enrichment. Descriptive renderer, not a simulator. For a live containerlab graph --template, see xray-graph.html.