Hassle free linking in mermaid graphs

Starting from 0.9.21, the format for using internal links in mermaid diagrams will be this:

A[Note Name] --> B 

class A internal-link;

(Pointed out by WhiteNoise below.)


OLD POST:
Idea:
hassle free linking in mermaid graphs, by using the [[note]] linking. It seems counter intuitive to me, as it is possible to render nodes in mermaid which display as [[note]], by using “[[…]]” inside the description of a node.
Example:
Mermaid
A[MOC Name] --> B[“[[first note the moc wants to link to]]“]

Use cases:
Useful in MOCs, notes about processes that have many complicated steps to them

Current workaround:
https://discord.com/channels/686053708261228577/744933215063638183/765156496543318027

8 Likes

I was just about to write this feature requests, this would be amazing.

It would allow for extremly visual and creative ways to display the relationship between notes. It will also allow to create some amazing visual workflows and take mermaid to a whole new level.

There seems to be a really cool post on a workaround way to achieve it

Obsidian Links in Mermaid

Unfortunatly, with obsidian 0.9.3 it doesn’t seem to work anymore

Would love to see this implemented if possible, thanks

2 Likes

Hey santi,

check the discord link in the post, there is another way to make it work - fiddly though

1 Like

thought it was the same work around, will take a look thanks!

Yes, the workaround was working in 0.9.2 but stopped working in 0.9.3.

Another reason why it would be a great feature to have is because the Obsidian URI links don’t work in Publish.

2 Likes

thanks for the info, is there any current workaround for this? (I’m in version 0.9.6)

I’m trying out the one created by @tallguyjenks

@koala54 is this the workaround you said stopped working in version 0.9.3, or were you refering to the other one?

@santi
The linking with Obsidian URI links works, it just doesn’t show files on hover and if you simultaneously display a graph or local graph view, this graph view disappears (until you refresh or drag the window with the graph somewhere else). And it doesn’t work in Publish. (I’ve already reported that.)

The one which stopped working in 0.9.3 is the one you linked to at the end. Now in 0.9.6 one part of it works again: creating a new file by clicking on it. However, once created, it won’t open the file (when you click on the link in the mermaid diagram, of course it opens if you click on it in the file browser).

1 Like

got you, I just tested the old work around and I know what you mean it displays “File already exists” I hope there’s the change to do that version again in the future.

I tested the URI approach and it worked on a Mac, but my computer is Linux and I got stuck setting up the URI I posted it here

Thanks for the help!

Starting from 0.9.21, the format for using internal links in mermaid diagrams will be this:

graph LR
A[Note Name] --> B 

class A internal-link;
4 Likes

@WhiteNoise Would you be able to share the corresponding notation for actors in Sequence Diagrams?

I am using Obsidian in an Android Mobile. I want to link to my notes headings.

  • It is possible according to test1, I shared below but I don’t want it to be display as test#test1 instead just test1.

  • I tried test2, the way links work as I want just in .MD file but not within mermaid.

  • Then, I tried test3, obsidian uri don’t work within mermaid

Please be kind enough to assist me on this problem

1 Like

Hi @zakee , so far as I know it’s not possible to alias links in a Mermaid diagram. Only the full page or section link will work. :frowning:

It seems as though linked pages are not recognized as outgoing links.

graph TD

A["@page1"] 
B["@page2"] 

A --> B

class A,B internal-link;

This links just fine but does not show up in the “Outgoing Links” pane.

1 Like

These obsidian extensions do not appear to work in other markdown editors that support mermaid as they are not actual mermaid syntax. So using them will tie your notes to obsidian.