Mermaid: shown text different from the internal link target?

Help
,
1

Hi all,

I’m playing around with mermaid diagrams and found that by setting the class to internal-link, I can make my diagrams clickable. Very useful. I can now generate a “map” out of the notes for my planned hiking routes and their start/end points with dataviewjs, I hadn’t expected that to be this easy.

But now I’m a bit stuck.

I want the text displayed for the link to be different from the name of the Obsidian note it links to. Is that at all possible?

I tried the very blunt:

flowchart TD
  A["[My Text](My Link)"] --> B
  class A internal-link;

(i.e., making the link text of the node descriptor a markdown formatted link)

But that didn’t work, and nothing else did either.

I could live with the mermaid ‘id’ “A” being the link target maybe, since that’s not otherwise shown, but I couldn’t figure that out either.

Best!

2

I’ve tried the internal-link. It’s a great function.

And then I try to make an alternative text, but it seems not work on obsidian.

The mermaid Markdown Format shows it does not support markdown link:

graph LR

A --> B["`[link](link)`"]

And the mermaid interaction could work, but only support http/https, could not handle obsidian://

graph LR

A --> B

click B "obsidian://open?vault=default&file=Untitled" "Tooltip"

Maybe the Mermaid Interaction can inspire you.

3

Right, I tried all that.

So it seems it’s not possible and maybe I need to file a feature request.

4

I didn’t use the Mehrmaid plugin but I seem to remember its ability to use markdown.

  • P.S. That’s Mehrmaid, with an ‘h’.
    • What stopped me from trying it is the fact that if I want to display diagrams on my online texts, I cannot rely on such plugins.
5

Oh, interesting! mehrmaid seems interesting (if abandoned). I wish that was built into our core mermaid engine.

6

It works great! Thank you.

1 Like
7

I just ran across the following solution

```mermaid
flowchart TD
A --> B
A["<a class='internal-link' href='My Link'>My Text</a>"]
```