mirror of
https://github.com/ada-dmitry/ada-dmitry.github.io.git
synced 2026-09-24 01:10:35 +00:00
34 lines
1009 B
Markdown
34 lines
1009 B
Markdown
---
|
|
layout: single
|
|
title: "Граф заметок"
|
|
permalink: /graph/
|
|
---
|
|
|
|
<div id="graph" style="height:70vh"></div>
|
|
|
|
<script src="https://unpkg.com/force-graph"></script>
|
|
<script>
|
|
fetch('{{ "/assets/js/graph-data.json" | relative_url }}')
|
|
.then(r => r.json())
|
|
.then(data => {
|
|
const el = document.getElementById('graph');
|
|
const Graph = ForceGraph()(el)
|
|
.graphData(data)
|
|
.nodeId('id')
|
|
.nodeLabel(n => n.title)
|
|
.nodeAutoColorBy('group')
|
|
.backgroundColor(getComputedStyle(document.body).backgroundColor || '#111')
|
|
.linkColor(() => 'rgba(173,216,230,0.6)')
|
|
.linkDirectionalParticles(2)
|
|
.linkDirectionalParticleSpeed(0.004)
|
|
.onNodeClick(n => window.location = n.url);
|
|
|
|
// чуть уменьшить размеры узлов/шрифтов для тёмной темы
|
|
Graph.nodeRelSize(6);
|
|
});
|
|
</script>
|
|
|
|
<style>
|
|
#note-graph { height: 70vh; min-height: 420px; }
|
|
</style>
|
|
<div id="note-graph"></div> |