← Tools

Skill Tree Visualization

Force-directed SVG view of the 543-concept Nexus knowledge graph and its 684 prerequisite edges. Pan, zoom, filter by domain, search, and toggle mastery (shared with the Skill Mastery Map). Pure vanilla JS, no libraries.

Progress

0
Mastered
0
Total
0
Visible
0
Edges

Search

Display

Mastery view

Layout

Domains

Click a node to select it (red = prerequisites, green = dependents, 2 hops). Hover for details. Mastery state shares nexus_mastery_v1 with the Skill Mastery Map.
Loading…
Performance honest note: 543 nodes + force-directed layout in vanilla JS without WebGL is borderline. Initial simulation runs synchronously over ~250 ticks; on a modern desktop browser this completes in well under a second. Pan and zoom are smooth even with edges visible. Mobile devices and older laptops may stutter on first render — toggle off "Show edges" for smoother interaction. The repulsion step uses spatial bucketing (uniform grid) to skip far-away node pairs, which is enough for 543 nodes; full Barnes-Hut would be needed past ~5k nodes.