Compare commits

..

2 Commits

Author SHA1 Message Date
Anton Bulakh
06a9337ad1
fix(backlinks): Improve backlink perf and fix aliased backlinks
Backlink calculation is quadratic, similar to breadcrumbs before the
fix.

Apply a similar fix here.

Also added alias resolution, so this depends on `file.data.aliases`
from #1681, but that can be commented out easily if needed.
2025-01-24 18:41:33 +02:00
Anton Bulakh
413981663f
chore(styles): omit sass deprecation warnings (#1737)
update to newer API
2025-01-24 06:03:31 +02:00
5 changed files with 18 additions and 33 deletions

View File

@ -36,7 +36,6 @@ Component.Graph({
opacityScale: 1, // how quickly do we fade out the labels when zooming out? opacityScale: 1, // how quickly do we fade out the labels when zooming out?
removeTags: [], // what tags to remove from the graph removeTags: [], // what tags to remove from the graph
showTags: true, // whether to show tags in the graph showTags: true, // whether to show tags in the graph
enableRadial: false, // whether to constrain the graph, similar to Obsidian
}, },
globalGraph: { globalGraph: {
drag: true, drag: true,
@ -50,7 +49,6 @@ Component.Graph({
opacityScale: 1, opacityScale: 1,
removeTags: [], // what tags to remove from the graph removeTags: [], // what tags to remove from the graph
showTags: true, // whether to show tags in the graph showTags: true, // whether to show tags in the graph
enableRadial: true, // whether to constrain the graph, similar to Obsidian
}, },
}) })
``` ```

27
package-lock.json generated
View File

@ -34,7 +34,7 @@
"mdast-util-to-hast": "^13.2.0", "mdast-util-to-hast": "^13.2.0",
"mdast-util-to-string": "^4.0.0", "mdast-util-to-string": "^4.0.0",
"micromorph": "^0.4.5", "micromorph": "^0.4.5",
"pixi.js": "^8.7.3", "pixi.js": "^8.6.6",
"preact": "^10.25.4", "preact": "^10.25.4",
"preact-render-to-string": "^6.5.13", "preact-render-to-string": "^6.5.13",
"pretty-bytes": "^6.1.1", "pretty-bytes": "^6.1.1",
@ -79,10 +79,10 @@
"@types/d3": "^7.4.3", "@types/d3": "^7.4.3",
"@types/hast": "^3.0.4", "@types/hast": "^3.0.4",
"@types/js-yaml": "^4.0.9", "@types/js-yaml": "^4.0.9",
"@types/node": "^22.12.0", "@types/node": "^22.10.6",
"@types/pretty-time": "^1.1.5", "@types/pretty-time": "^1.1.5",
"@types/source-map-support": "^0.5.10", "@types/source-map-support": "^0.5.10",
"@types/ws": "^8.5.14", "@types/ws": "^8.5.13",
"@types/yargs": "^17.0.33", "@types/yargs": "^17.0.33",
"esbuild": "^0.24.2", "esbuild": "^0.24.2",
"prettier": "^3.4.2", "prettier": "^3.4.2",
@ -1914,11 +1914,10 @@
} }
}, },
"node_modules/@types/node": { "node_modules/@types/node": {
"version": "22.12.0", "version": "22.10.6",
"resolved": "https://registry.npmjs.org/@types/node/-/node-22.12.0.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-22.10.6.tgz",
"integrity": "sha512-Fll2FZ1riMjNmlmJOdAyY5pUbkftXslB5DgEzlIuNaiWhXd00FhWxVC/r4yV/4wBb9JfImTu+jiSvXTkJ7F/gA==", "integrity": "sha512-qNiuwC4ZDAUNcY47xgaSuS92cjf8JbSUoaKS77bmLG1rU7MlATVSiw/IlrjtIyyskXBZ8KkNfjK/P5na7rgXbQ==",
"dev": true, "dev": true,
"license": "MIT",
"dependencies": { "dependencies": {
"undici-types": "~6.20.0" "undici-types": "~6.20.0"
} }
@ -1944,11 +1943,10 @@
"integrity": "sha512-PBjIUxZHOuj0R15/xuwJYjFi+KZdNFrehocChv4g5hu6aFroHue8m0lBP0POdK2nKzbw0cgV1mws8+V/JAcEkQ==" "integrity": "sha512-PBjIUxZHOuj0R15/xuwJYjFi+KZdNFrehocChv4g5hu6aFroHue8m0lBP0POdK2nKzbw0cgV1mws8+V/JAcEkQ=="
}, },
"node_modules/@types/ws": { "node_modules/@types/ws": {
"version": "8.5.14", "version": "8.5.13",
"resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.14.tgz", "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.13.tgz",
"integrity": "sha512-bd/YFLW+URhBzMXurx7lWByOu+xzU9+kb3RboOteXYDfW+tr+JZa99OyNmPINEGB/ahzKrEuc8rcv4gnpJmxTw==", "integrity": "sha512-osM/gWBTPKgHV8XkTunnegTRIsvF6owmf5w+JtAfOw472dptdm0dlGv4xCt6GwQRcC2XVOvvRE/0bAoQcL2QkA==",
"dev": true, "dev": true,
"license": "MIT",
"dependencies": { "dependencies": {
"@types/node": "*" "@types/node": "*"
} }
@ -5585,10 +5583,9 @@
} }
}, },
"node_modules/pixi.js": { "node_modules/pixi.js": {
"version": "8.7.3", "version": "8.6.6",
"resolved": "https://registry.npmjs.org/pixi.js/-/pixi.js-8.7.3.tgz", "resolved": "https://registry.npmjs.org/pixi.js/-/pixi.js-8.6.6.tgz",
"integrity": "sha512-wfWlhJYnGx1s4f2yoouevQjaeacbJ12LTkJGa+n9AIYNIjOnmJylBtZ2mARX7iFk3mr2xv0wuo//XPe2hk5OBw==", "integrity": "sha512-o5pw7G2yuIrnBx0G4npBlmFp+XGNcapI/Ufs62rRj/4XKxc1Zo74YJr/BtEXcXTraTKd+pQvYOLvnfxRjxBMvQ==",
"license": "MIT",
"dependencies": { "dependencies": {
"@pixi/colord": "^2.9.6", "@pixi/colord": "^2.9.6",
"@types/css-font-loading-module": "^0.0.12", "@types/css-font-loading-module": "^0.0.12",

View File

@ -60,7 +60,7 @@
"mdast-util-to-hast": "^13.2.0", "mdast-util-to-hast": "^13.2.0",
"mdast-util-to-string": "^4.0.0", "mdast-util-to-string": "^4.0.0",
"micromorph": "^0.4.5", "micromorph": "^0.4.5",
"pixi.js": "^8.7.3", "pixi.js": "^8.6.6",
"preact": "^10.25.4", "preact": "^10.25.4",
"preact-render-to-string": "^6.5.13", "preact-render-to-string": "^6.5.13",
"pretty-bytes": "^6.1.1", "pretty-bytes": "^6.1.1",
@ -102,10 +102,10 @@
"@types/d3": "^7.4.3", "@types/d3": "^7.4.3",
"@types/hast": "^3.0.4", "@types/hast": "^3.0.4",
"@types/js-yaml": "^4.0.9", "@types/js-yaml": "^4.0.9",
"@types/node": "^22.12.0", "@types/node": "^22.10.6",
"@types/pretty-time": "^1.1.5", "@types/pretty-time": "^1.1.5",
"@types/source-map-support": "^0.5.10", "@types/source-map-support": "^0.5.10",
"@types/ws": "^8.5.14", "@types/ws": "^8.5.13",
"@types/yargs": "^17.0.33", "@types/yargs": "^17.0.33",
"esbuild": "^0.24.2", "esbuild": "^0.24.2",
"prettier": "^3.4.2", "prettier": "^3.4.2",

View File

@ -18,7 +18,6 @@ export interface D3Config {
removeTags: string[] removeTags: string[]
showTags: boolean showTags: boolean
focusOnHover?: boolean focusOnHover?: boolean
enableRadial?: boolean
} }
interface GraphOptions { interface GraphOptions {
@ -40,7 +39,6 @@ const defaultOptions: GraphOptions = {
showTags: true, showTags: true,
removeTags: [], removeTags: [],
focusOnHover: false, focusOnHover: false,
enableRadial: false,
}, },
globalGraph: { globalGraph: {
drag: true, drag: true,
@ -55,11 +53,10 @@ const defaultOptions: GraphOptions = {
showTags: true, showTags: true,
removeTags: [], removeTags: [],
focusOnHover: true, focusOnHover: true,
enableRadial: true,
}, },
} }
export default ((opts?: Partial<GraphOptions>) => { export default ((opts?: GraphOptions) => {
const Graph: QuartzComponent = ({ displayClass, cfg }: QuartzComponentProps) => { const Graph: QuartzComponent = ({ displayClass, cfg }: QuartzComponentProps) => {
const localGraph = { ...defaultOptions.localGraph, ...opts?.localGraph } const localGraph = { ...defaultOptions.localGraph, ...opts?.localGraph }
const globalGraph = { ...defaultOptions.globalGraph, ...opts?.globalGraph } const globalGraph = { ...defaultOptions.globalGraph, ...opts?.globalGraph }

View File

@ -8,7 +8,6 @@ import {
forceCenter, forceCenter,
forceLink, forceLink,
forceCollide, forceCollide,
forceRadial,
zoomIdentity, zoomIdentity,
select, select,
drag, drag,
@ -88,7 +87,6 @@ async function renderGraph(container: string, fullSlug: FullSlug) {
removeTags, removeTags,
showTags, showTags,
focusOnHover, focusOnHover,
enableRadial,
} = JSON.parse(graph.dataset["cfg"]!) as D3Config } = JSON.parse(graph.dataset["cfg"]!) as D3Config
const data: Map<SimpleSlug, ContentDetails> = new Map( const data: Map<SimpleSlug, ContentDetails> = new Map(
@ -163,20 +161,15 @@ async function renderGraph(container: string, fullSlug: FullSlug) {
})), })),
} }
const width = graph.offsetWidth
const height = Math.max(graph.offsetHeight, 250)
// we virtualize the simulation and use pixi to actually render it // we virtualize the simulation and use pixi to actually render it
// Calculate the radius of the container circle
const radius = Math.min(width, height) / 2 - 40 // 40px padding
const simulation: Simulation<NodeData, LinkData> = forceSimulation<NodeData>(graphData.nodes) const simulation: Simulation<NodeData, LinkData> = forceSimulation<NodeData>(graphData.nodes)
.force("charge", forceManyBody().strength(-100 * repelForce)) .force("charge", forceManyBody().strength(-100 * repelForce))
.force("center", forceCenter().strength(centerForce)) .force("center", forceCenter().strength(centerForce))
.force("link", forceLink(graphData.links).distance(linkDistance)) .force("link", forceLink(graphData.links).distance(linkDistance))
.force("collide", forceCollide<NodeData>((n) => nodeRadius(n)).iterations(3)) .force("collide", forceCollide<NodeData>((n) => nodeRadius(n)).iterations(3))
if (enableRadial) const width = graph.offsetWidth
simulation.force("radial", forceRadial(radius * 0.8, width / 2, height / 2).strength(0.3)) const height = Math.max(graph.offsetHeight, 250)
// precompute style prop strings as pixi doesn't support css variables // precompute style prop strings as pixi doesn't support css variables
const cssVars = [ const cssVars = [