From 39592347cc742838a1d078031b897fe26a94adaf Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Mon, 27 Dec 2021 18:06:58 +0000
Subject: [PATCH] add graph depth config
---
layouts/_default/section.html | 0
data/graphConfig.yaml | 1 +
layouts/partials/graph.html | 33 +++++++++++++++++++++++++++------
3 files changed, 28 insertions(+), 6 deletions(-)
diff --git a/data/graphConfig.yaml b/data/graphConfig.yaml
index 4104e42..3f8d3fb 100644
--- a/data/graphConfig.yaml
+++ b/data/graphConfig.yaml
@@ -1,5 +1,6 @@
enableLegend: false
enableDrag: true
enableZoom: true
+depth: -1 # set to -1 to show full graph
paths:
- /moc: "#4388cc"
\ No newline at end of file
diff --git a/layouts/_default/section.html b/layouts/_default/section.html
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/layouts/_default/section.html
diff --git a/layouts/partials/graph.html b/layouts/partials/graph.html
index 7dcd536..e8cd966 100644
--- a/layouts/partials/graph.html
+++ b/layouts/partials/graph.html
@@ -16,12 +16,35 @@
const content = {{$.Site.Data.contentIndex}}
const curPage = {{ strings.TrimRight "/" .Page.RelPermalink }}
const pathColors = {{$.Site.Data.graphConfig.paths}}
+ let depth = {{$.Site.Data.graphConfig.depth}}
const parseIdsFromLinks = (links) => [...(new Set(links.flatMap(link => ([link.source, link.target]))))]
+ const neighbours = new Set()
+ const wl = [curPage || "/", "__SENTINEL"]
+ if (depth >= 0) {
+ while (depth >= 0 && wl.length > 0) {
+ // compute neighbours
+ const cur = wl.shift()
+ console.log(depth, cur, wl)
+ if (cur === "__SENTINEL") {
+ depth--
+ wl.push("__SENTINEL")
+ } else {
+ neighbours.add(cur)
+ const outgoing = index.links[cur] || []
+ const incoming = index.backlinks[cur] || []
+ console.log(incoming)
+ wl.push(...outgoing.map(l => l.target), ...incoming.map(l => l.source))
+ }
+ }
+ } else {
+ parseIdsFromLinks(links).forEach(id => neighbours.add(id))
+ }
+
const data = {
- nodes: parseIdsFromLinks(links).map(id => ({id})),
- links,
+ nodes: [...neighbours].map(id => ({id})),
+ links: links.filter(l => neighbours.has(l.source) && neighbours.has(l.target)),
}
const color = (d) => {
@@ -70,10 +93,8 @@
const width = document.getElementById("graph-container").offsetWidth
const simulation = d3.forceSimulation(data.nodes)
- .force("charge", d3.forceManyBody().strength(-20))
- .force("link", d3.forceLink(data.links)
- .id(d => d.id)
- )
+ .force("charge", d3.forceManyBody().strength(-30))
+ .force("link", d3.forceLink(data.links).id(d => d.id))
.force("center", d3.forceCenter());
const svg = d3.select('#graph-container')
--
Gitblit v1.10.0