Obsidian Graph View
By Amr
Interactive force-directed map of every wiki-link in the site, mirroring Obsidian's local graph.
Estimated reading time: 2 minutes
Table of Contents
Obsidian Graph View
A live, force-directed map of every page on this site and every
[[wiki-link]] between them. This is the rendered-site equivalent of
Obsidian’s local graph view — built from the same
assets/data/wiki-index.json
that powers the client-side resolver
and backlinks panel.
Posts
Docs
Notes
Notebooks
Quickstart
Pages
Broken links
Tips: click a node to open the page · ⌘/Ctrl-click to
open in a new tab · drag to reposition · scroll to zoom · hover to
highlight a node's neighborhood · type in the search box to filter.
How it’s built
| Piece | File |
|---|---|
| Build-time index (nodes + outgoing edges) | assets/data/wiki-index.json (Liquid template at assets/data/wiki-index.json) |
| Renderer | assets/js/obsidian-graph.js |
| Layout engine | cytoscape.js (loaded from CDN, only on this page) |
Outgoing edges come from the same [[…]] syntax the resolver handles —
unresolved targets show up as dashed red nodes so you can find dangling
links at a glance. The graph is regenerated every Jekyll build; nothing
runs client-side except cytoscape’s force layout.
See also
- [[Obsidian Vault Integration]]
- [[Obsidian Syntax Reference]]
- [[Obsidian Authoring Workflow]]
- [[Getting Started with the Obsidian Vault]]
- [[Obsidian Integration Troubleshooting]]