Broken Global Graph View

[ldiex]

Describe the bug
Global graph view cannot render properly.
To Reproduce

1. You can just visit my Quartz site
2. Click the global graph button
3. Then you can see the broken graph view, something like this:

Expected behavior
The graph should be rendered properly, just like in Obsidian

Screenshots and Source
Screenshot can be seen above.
link to my Quartz repository.

Desktop

• Quartz Version: v4.4.0
• node Version: v20.17.0
• npm version: 10.8.2
• OS: Windows 11 and macOS 10.15
• Browser: Chrome v131

[aarnphm]

hmm, ok this is the second instance of this then. Can you show me which revision breaks this?

[ldiex]

Yeah. The graph strated to break at this commit
and at the commit on the day before that, all things looked fine.
So this issue may be related to your commits on Sep 25, 2024.

[topdeoo]

Yeah. The graph strated to break at this commit and at the commit on the day before that, all things looked fine. So this issue may be related to your commits on Sep 25, 2024.

Hey, I just tried a wired way at commit: set the options of Graph in quartz/components/Graph.tsx like this ( just set showTags into false in globalGraph field ):

 globalGraph: {
   drag: true,
   zoom: true,
   depth: -1,
   scale: 0.9,
   repelForce: 0.5,
   centerForce: 0.3,
   linkDistance: 30,
   fontSize: 0.6,
   opacityScale: 1,
   showTags: true,
   removeTags: [],
   focusOnHover: true,
 },

and it seems to work :), but this is not the correct way to solve this problem.

[ldiex]

Yeah. The graph strated to break at this commit and at the commit on the day before that, all things looked fine. So this issue may be related to your commits on Sep 25, 2024.

Hey, I just tried a wired way at commit: set the options of Graph in quartz/components/Graph.tsx like this ( just set showTags into false in globalGraph field ):

 globalGraph: {
   drag: true,
   zoom: true,
   depth: -1,
   scale: 0.9,
   repelForce: 0.5,
   centerForce: 0.3,
   linkDistance: 30,
   fontSize: 0.6,
   opacityScale: 1,
   showTags: true,
   removeTags: [],
   focusOnHover: true,
 },

and it seems to work :), but this is not the correct way to solve this problem.

Thank you for your reply. However, this solution does not work at my latest commit

[topdeoo]

Yeah. The graph strated to break at this commit and at the commit on the day before that, all things looked fine. So this issue may be related to your commits on Sep 25, 2024.

Hey, I just tried a wired way at commit: set the options of Graph in quartz/components/Graph.tsx like this ( just set showTags into false in globalGraph field ):

 globalGraph: {
   drag: true,
   zoom: true,
   depth: -1,
   scale: 0.9,
   repelForce: 0.5,
   centerForce: 0.3,
   linkDistance: 30,
   fontSize: 0.6,
   opacityScale: 1,
   showTags: true,
   removeTags: [],
   focusOnHover: true,
 },

and it seems to work :), but this is not the correct way to solve this problem.

Thank you for your reply. However, this solution does not work at my latest commit

Is it possible that this bug is caused by a massive graph( a lot of vertices)? Because hidding the tag node is a way to reduce the vertices in graph.

[theCampel]

Hey! Fwiw, I've got the same bug. I posted and did some troubleshooting on the Discord.

TLDR:

• Not a cache problem
• Not a browser problem
• Happens on latest version of pixi.js
• I've seen sites with bigger graphs that don't have this issue (thus likely not a purely graph size issue)
• Changing to absolute paths doesn't fix
• Doesn't seem to be a tag issue
• Issue does not occur on the docs - therefore it's likely the notes.
• Seems to be according to @saberzero1 a problem with sluggified links.
• There seems to be a correlation with the edges of the messed-up-stuff being sub-strings of eachother.

I appreciate any advice on the matter.