This repository was archived by the owner on Aug 29, 2026. It is now read-only.

visualize

Directory actions

More options

Directory actions

More options

Latest commit

History

History

visualize

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
README.md
README.md
graph.html
graph.html

README.md

Visualize

openkb visualize renders your wiki's [[wikilink]] graph as a self-contained, interactive HTML page — a fast way to see how knowledge connects across the documents you've ingested.

Real artifact in this folder:graph.html — the graph generated from one paper (13 nodes, 96 edges). Open it in a browser and switch between the 3D / mind-map / radial modes; click a node to inspect it.

openkb visualize
Graph written to /Users/you/my-kb/output/visualize/graph.html (13 nodes, 96 edges)
# opens in your default browser

By default it opens the page in your browser after generating. For headless environments (CI, a remote box), skip the launch:

openkb visualize --no-open

Prerequisite: you need a compiled wiki. With nothing ingested yet, it tells you to run openkb add first. The graph.html here was built from the wiki in ../commands/sample-wiki/.

What's in the graph

  • Nodes — every page under wiki/summaries/, wiki/concepts/, and wiki/entities/. Each carries its label, type, description, sources, and in/out degree (used to size it).
  • Edges — directed [[wikilink]] references between pages. Self-loops are dropped and duplicates collapsed.
  • Types — taken from a page's frontmatter or its directory, and used to color nodes and drive the legend filter.

The single HTML file embeds the graph data and all rendering code, so you can share it or commit it without any external dependencies.

Three view modes

Switch between these from buttons in the page:

ModeLayout
3D(default)Force-directed "nebula" in 3D — orbit, zoom, and drag-to-pin nodes.
mind-mapHorizontal tree: OpenKB → documents (summaries) → concepts.
radialOpenKB at the hub, documents on spokes, concepts radiating out; zoom/pan.

The page also has search (filter by label), a type legend you can toggle, a spacing slider, and a node inspector — click a node to see its description, sources, and links.

Where it fits

visualize is read-only and re-runs cheaply, so it pairs well with the rest of the loop:

openkb add ~/papers/ # ingest a batch
openkb lint --fix # repair any dangling links so the graph is clean
openkb visualize # see the shape of what you've built

A sparse graph with many orphans usually means documents aren't sharing concepts yet — add more in the same domain and watch the concept hubs grow as knowledge compounds.

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all 
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '

Skip to content

This repository was archived by the owner on Aug 29, 2026. It is now read-only.

visualize
Directory actions
More options
Directory actions
More options
Latest commit
History
History
visualize
Folders and files
NameName
Last commit message
Last commit date
parent directory
..
README.md
README.md
graph.html
graph.html
README.md
Visualize
openkb visualize renders your wiki's [[wikilink]] graph as a self-contained,
interactive HTML page — a fast way to see how knowledge connects across the
documents you've ingested.
Real artifact in this folder:graph.html — the graph
generated from one paper (13 nodes, 96 edges). Open it in a browser and switch
between the 3D / mind-map / radial modes; click a node to inspect it.
openkb visualize
Graph written to /Users/you/my-kb/output/visualize/graph.html (13 nodes, 96 edges)
# opens in your default browser

By default it opens the page in your browser after generating. For headless
environments (CI, a remote box), skip the launch:
openkb visualize --no-open
Prerequisite: you need a compiled wiki. With nothing ingested yet, it tells
you to run openkb add first. The graph.html here was built from
the wiki in ../commands/sample-wiki/.
What's in the graph
  • Nodes — every page under wiki/summaries/, wiki/concepts/, and
wiki/entities/. Each carries its label, type, description, sources, and
in/out degree (used to size it).
  • Edges — directed [[wikilink]] references between pages. Self-loops are
dropped and duplicates collapsed.
  • Types — taken from a page's frontmatter or its directory, and used to color
nodes and drive the legend filter.
The single HTML file embeds the graph data and all rendering code, so you can
share it or commit it without any external dependencies.
Three view modes
Switch between these from buttons in the page:
ModeLayout
3D(default)Force-directed "nebula" in 3D — orbit, zoom, and drag-to-pin nodes.
mind-mapHorizontal tree: OpenKB → documents (summaries) → concepts.
radialOpenKB at the hub, documents on spokes, concepts radiating out; zoom/pan.
The page also has search (filter by label), a type legend you can toggle, a
spacing slider, and a node inspector — click a node to see its description,
sources, and links.
Where it fits
visualize is read-only and re-runs cheaply, so it pairs well with the rest of
the loop:
openkb add ~/papers/ # ingest a batch
openkb lint --fix # repair any dangling links so the graph is clean
openkb visualize # see the shape of what you've built
A sparse graph with many orphans usually means documents aren't sharing concepts
yet — add more in the same domain and watch the concept hubs grow as knowledge
compounds.

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix");
}
} catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content

This repository was archived by the owner on Aug 29, 2026. It is now read-only.

visualize
Directory actions
More options
Directory actions
More options
Latest commit
History
History
visualize
Folders and files
NameName
Last commit message
Last commit date
parent directory
..
README.md
README.md
graph.html
graph.html
README.md
Visualize
openkb visualize renders your wiki's [[wikilink]] graph as a self-contained,
interactive HTML page — a fast way to see how knowledge connects across the
documents you've ingested.
Real artifact in this folder:graph.html — the graph
generated from one paper (13 nodes, 96 edges). Open it in a browser and switch
between the 3D / mind-map / radial modes; click a node to inspect it.
openkb visualize
Graph written to /Users/you/my-kb/output/visualize/graph.html (13 nodes, 96 edges)
# opens in your default browser

By default it opens the page in your browser after generating. For headless
environments (CI, a remote box), skip the launch:
openkb visualize --no-open
Prerequisite: you need a compiled wiki. With nothing ingested yet, it tells
you to run openkb add first. The graph.html here was built from
the wiki in ../commands/sample-wiki/.
What's in the graph
  • Nodes — every page under wiki/summaries/, wiki/concepts/, and
wiki/entities/. Each carries its label, type, description, sources, and
in/out degree (used to size it).
  • Edges — directed [[wikilink]] references between pages. Self-loops are
dropped and duplicates collapsed.
  • Types — taken from a page's frontmatter or its directory, and used to color
nodes and drive the legend filter.
The single HTML file embeds the graph data and all rendering code, so you can
share it or commit it without any external dependencies.
Three view modes
Switch between these from buttons in the page:
ModeLayout
3D(default)Force-directed "nebula" in 3D — orbit, zoom, and drag-to-pin nodes.
mind-mapHorizontal tree: OpenKB → documents (summaries) → concepts.
radialOpenKB at the hub, documents on spokes, concepts radiating out; zoom/pan.
The page also has search (filter by label), a type legend you can toggle, a
spacing slider, and a node inspector — click a node to see its description,
sources, and links.
Where it fits
visualize is read-only and re-runs cheaply, so it pairs well with the rest of
the loop:
openkb add ~/papers/ # ingest a batch
openkb lint --fix # repair any dangling links so the graph is clean
openkb visualize # see the shape of what you've built
A sparse graph with many orphans usually means documents aren't sharing concepts
yet — add more in the same domain and watch the concept hubs grow as knowledge
compounds.

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms");
}
} catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content

This repository was archived by the owner on Aug 29, 2026. It is now read-only.

visualize
Directory actions
More options
Directory actions
More options
Latest commit
History
History
visualize
Folders and files
NameName
Last commit message
Last commit date
parent directory
..
README.md
README.md
graph.html
graph.html
README.md
Visualize
openkb visualize renders your wiki's [[wikilink]] graph as a self-contained,
interactive HTML page — a fast way to see how knowledge connects across the
documents you've ingested.
Real artifact in this folder:graph.html — the graph
generated from one paper (13 nodes, 96 edges). Open it in a browser and switch
between the 3D / mind-map / radial modes; click a node to inspect it.
openkb visualize
Graph written to /Users/you/my-kb/output/visualize/graph.html (13 nodes, 96 edges)
# opens in your default browser

By default it opens the page in your browser after generating. For headless
environments (CI, a remote box), skip the launch:
openkb visualize --no-open
Prerequisite: you need a compiled wiki. With nothing ingested yet, it tells
you to run openkb add first. The graph.html here was built from
the wiki in ../commands/sample-wiki/.
What's in the graph
  • Nodes — every page under wiki/summaries/, wiki/concepts/, and
wiki/entities/. Each carries its label, type, description, sources, and
in/out degree (used to size it).
  • Edges — directed [[wikilink]] references between pages. Self-loops are
dropped and duplicates collapsed.
  • Types — taken from a page's frontmatter or its directory, and used to color
nodes and drive the legend filter.
The single HTML file embeds the graph data and all rendering code, so you can
share it or commit it without any external dependencies.
Three view modes
Switch between these from buttons in the page:
ModeLayout
3D(default)Force-directed "nebula" in 3D — orbit, zoom, and drag-to-pin nodes.
mind-mapHorizontal tree: OpenKB → documents (summaries) → concepts.
radialOpenKB at the hub, documents on spokes, concepts radiating out; zoom/pan.
The page also has search (filter by label), a type legend you can toggle, a
spacing slider, and a node inspector — click a node to see its description,
sources, and links.
Where it fits
visualize is read-only and re-runs cheaply, so it pairs well with the rest of
the loop:
openkb add ~/papers/ # ingest a batch
openkb lint --fix # repair any dangling links so the graph is clean
openkb visualize # see the shape of what you've built
A sparse graph with many orphans usually means documents aren't sharing concepts
yet — add more in the same domain and watch the concept hubs grow as knowledge
compounds.

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links");
}
} catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); }
})();
(function(){
try {
var __m = "youtube.com";
var __re = new RegExp('^' + "youtube\\.com" + '

Skip to content

This repository was archived by the owner on Aug 29, 2026. It is now read-only.

visualize
Directory actions
More options
Directory actions
More options
Latest commit
History
History
visualize
Folders and files
NameName
Last commit message
Last commit date
parent directory
..
README.md
README.md
graph.html
graph.html
README.md
Visualize
openkb visualize renders your wiki's [[wikilink]] graph as a self-contained,
interactive HTML page — a fast way to see how knowledge connects across the
documents you've ingested.
Real artifact in this folder:graph.html — the graph
generated from one paper (13 nodes, 96 edges). Open it in a browser and switch
between the 3D / mind-map / radial modes; click a node to inspect it.
openkb visualize
Graph written to /Users/you/my-kb/output/visualize/graph.html (13 nodes, 96 edges)
# opens in your default browser

By default it opens the page in your browser after generating. For headless
environments (CI, a remote box), skip the launch:
openkb visualize --no-open
Prerequisite: you need a compiled wiki. With nothing ingested yet, it tells
you to run openkb add first. The graph.html here was built from
the wiki in ../commands/sample-wiki/.
What's in the graph
  • Nodes — every page under wiki/summaries/, wiki/concepts/, and
wiki/entities/. Each carries its label, type, description, sources, and
in/out degree (used to size it).
  • Edges — directed [[wikilink]] references between pages. Self-loops are
dropped and duplicates collapsed.
  • Types — taken from a page's frontmatter or its directory, and used to color
nodes and drive the legend filter.
The single HTML file embeds the graph data and all rendering code, so you can
share it or commit it without any external dependencies.
Three view modes
Switch between these from buttons in the page:
ModeLayout
3D(default)Force-directed "nebula" in 3D — orbit, zoom, and drag-to-pin nodes.
mind-mapHorizontal tree: OpenKB → documents (summaries) → concepts.
radialOpenKB at the hub, documents on spokes, concepts radiating out; zoom/pan.
The page also has search (filter by label), a type legend you can toggle, a
spacing slider, and a node inspector — click a node to see its description,
sources, and links.
Where it fits
visualize is read-only and re-runs cheaply, so it pairs well with the rest of
the loop:
openkb add ~/papers/ # ingest a batch
openkb lint --fix # repair any dangling links so the graph is clean
openkb visualize # see the shape of what you've built
A sparse graph with many orphans usually means documents aren't sharing concepts
yet — add more in the same domain and watch the concept hubs grow as knowledge
compounds.

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default");
}
} catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content

This repository was archived by the owner on Aug 29, 2026. It is now read-only.

visualize
Directory actions
More options
Directory actions
More options
Latest commit
History
History
visualize
Folders and files
NameName
Last commit message
Last commit date
parent directory
..
README.md
README.md
graph.html
graph.html
README.md
Visualize
openkb visualize renders your wiki's [[wikilink]] graph as a self-contained,
interactive HTML page — a fast way to see how knowledge connects across the
documents you've ingested.
Real artifact in this folder:graph.html — the graph
generated from one paper (13 nodes, 96 edges). Open it in a browser and switch
between the 3D / mind-map / radial modes; click a node to inspect it.
openkb visualize
Graph written to /Users/you/my-kb/output/visualize/graph.html (13 nodes, 96 edges)
# opens in your default browser

By default it opens the page in your browser after generating. For headless
environments (CI, a remote box), skip the launch:
openkb visualize --no-open
Prerequisite: you need a compiled wiki. With nothing ingested yet, it tells
you to run openkb add first. The graph.html here was built from
the wiki in ../commands/sample-wiki/.
What's in the graph
  • Nodes — every page under wiki/summaries/, wiki/concepts/, and
wiki/entities/. Each carries its label, type, description, sources, and
in/out degree (used to size it).
  • Edges — directed [[wikilink]] references between pages. Self-loops are
dropped and duplicates collapsed.
  • Types — taken from a page's frontmatter or its directory, and used to color
nodes and drive the legend filter.
The single HTML file embeds the graph data and all rendering code, so you can
share it or commit it without any external dependencies.
Three view modes
Switch between these from buttons in the page:
ModeLayout
3D(default)Force-directed "nebula" in 3D — orbit, zoom, and drag-to-pin nodes.
mind-mapHorizontal tree: OpenKB → documents (summaries) → concepts.
radialOpenKB at the hub, documents on spokes, concepts radiating out; zoom/pan.
The page also has search (filter by label), a type legend you can toggle, a
spacing slider, and a node inspector — click a node to see its description,
sources, and links.
Where it fits
visualize is read-only and re-runs cheaply, so it pairs well with the rest of
the loop:
openkb add ~/papers/ # ingest a batch
openkb lint --fix # repair any dangling links so the graph is clean
openkb visualize # see the shape of what you've built
A sparse graph with many orphans usually means documents aren't sharing concepts
yet — add more in the same domain and watch the concept hubs grow as knowledge
compounds.

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers");
}
} catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content

This repository was archived by the owner on Aug 29, 2026. It is now read-only.

visualize
Directory actions
More options
Directory actions
More options
Latest commit
History
History
visualize
Folders and files
NameName
Last commit message
Last commit date
parent directory
..
README.md
README.md
graph.html
graph.html
README.md
Visualize
openkb visualize renders your wiki's [[wikilink]] graph as a self-contained,
interactive HTML page — a fast way to see how knowledge connects across the
documents you've ingested.
Real artifact in this folder:graph.html — the graph
generated from one paper (13 nodes, 96 edges). Open it in a browser and switch
between the 3D / mind-map / radial modes; click a node to inspect it.
openkb visualize
Graph written to /Users/you/my-kb/output/visualize/graph.html (13 nodes, 96 edges)
# opens in your default browser

By default it opens the page in your browser after generating. For headless
environments (CI, a remote box), skip the launch:
openkb visualize --no-open
Prerequisite: you need a compiled wiki. With nothing ingested yet, it tells
you to run openkb add first. The graph.html here was built from
the wiki in ../commands/sample-wiki/.
What's in the graph
  • Nodes — every page under wiki/summaries/, wiki/concepts/, and
wiki/entities/. Each carries its label, type, description, sources, and
in/out degree (used to size it).
  • Edges — directed [[wikilink]] references between pages. Self-loops are
dropped and duplicates collapsed.
  • Types — taken from a page's frontmatter or its directory, and used to color
nodes and drive the legend filter.
The single HTML file embeds the graph data and all rendering code, so you can
share it or commit it without any external dependencies.
Three view modes
Switch between these from buttons in the page:
ModeLayout
3D(default)Force-directed "nebula" in 3D — orbit, zoom, and drag-to-pin nodes.
mind-mapHorizontal tree: OpenKB → documents (summaries) → concepts.
radialOpenKB at the hub, documents on spokes, concepts radiating out; zoom/pan.
The page also has search (filter by label), a type legend you can toggle, a
spacing slider, and a node inspector — click a node to see its description,
sources, and links.
Where it fits
visualize is read-only and re-runs cheaply, so it pairs well with the rest of
the loop:
openkb add ~/papers/ # ingest a batch
openkb lint --fix # repair any dangling links so the graph is clean
openkb visualize # see the shape of what you've built
A sparse graph with many orphans usually means documents aren't sharing concepts
yet — add more in the same domain and watch the concept hubs grow as knowledge
compounds.

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode");
}
} catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); }
})();
})();

Skip to content

This repository was archived by the owner on Aug 29, 2026. It is now read-only.

visualize
Directory actions
More options
Directory actions
More options
Latest commit
History
History
visualize
Folders and files
NameName
Last commit message
Last commit date
parent directory
..
README.md
README.md
graph.html
graph.html
README.md
Visualize
openkb visualize renders your wiki's [[wikilink]] graph as a self-contained,
interactive HTML page — a fast way to see how knowledge connects across the
documents you've ingested.
Real artifact in this folder:graph.html — the graph
generated from one paper (13 nodes, 96 edges). Open it in a browser and switch
between the 3D / mind-map / radial modes; click a node to inspect it.
openkb visualize
Graph written to /Users/you/my-kb/output/visualize/graph.html (13 nodes, 96 edges)
# opens in your default browser

By default it opens the page in your browser after generating. For headless
environments (CI, a remote box), skip the launch:
openkb visualize --no-open
Prerequisite: you need a compiled wiki. With nothing ingested yet, it tells
you to run openkb add first. The graph.html here was built from
the wiki in ../commands/sample-wiki/.
What's in the graph
  • Nodes — every page under wiki/summaries/, wiki/concepts/, and
wiki/entities/. Each carries its label, type, description, sources, and
in/out degree (used to size it).
  • Edges — directed [[wikilink]] references between pages. Self-loops are
dropped and duplicates collapsed.
  • Types — taken from a page's frontmatter or its directory, and used to color
nodes and drive the legend filter.
The single HTML file embeds the graph data and all rendering code, so you can
share it or commit it without any external dependencies.
Three view modes
Switch between these from buttons in the page:
ModeLayout
3D(default)Force-directed "nebula" in 3D — orbit, zoom, and drag-to-pin nodes.
mind-mapHorizontal tree: OpenKB → documents (summaries) → concepts.
radialOpenKB at the hub, documents on spokes, concepts radiating out; zoom/pan.
The page also has search (filter by label), a type legend you can toggle, a
spacing slider, and a node inspector — click a node to see its description,
sources, and links.
Where it fits
visualize is read-only and re-runs cheaply, so it pairs well with the rest of
the loop:
openkb add ~/papers/ # ingest a batch
openkb lint --fix # repair any dangling links so the graph is clean
openkb visualize # see the shape of what you've built
A sparse graph with many orphans usually means documents aren't sharing concepts
yet — add more in the same domain and watch the concept hubs grow as knowledge
compounds.