How to add a link in a mermaid node description?

WoJ picture WoJ · Jan 31, 2017 · Viewed 10.9k times · Source

I would like, to the graph below,

to add an actual link under link pointing to http://google.com.

I tried to modify the relevant node to

B[an <b>important</b> <a href="http://google.com">link</a>] 

but this breaks (crashes) the graph. Specifically, I noticed that what is not accepted is the href element.

Is it possible to add a link in the mermaid node description?

EDIT: I opened a bug report on the mermaid.js repository. Not fixed yet as of June 2017.

Answer

derHugo picture derHugo · Aug 14, 2018

I know it's late but: I was searching for a similar thing and found this. Your problem are the " of the href definition breaking the mermaid syntax.

I could achieve what you wanted to do by using

B[an <b>important</b> <a href='http://google.com'>link</a>]

so replacing the doublequotes " of the href definition with single ones '

See the example here.


Update a year later

in a newer version of mermaid this is not directly supported anymore (ಠ_ಠ)

more about it under Special note regarding version 8.2

Now you'll need to additionally allow unsecure content via

mermaidAPI.initialize({
    securityLevel: 'loose'
});