How can i add hyperlink or anchor tag to one of the box

[harshdamaniahd]

Firstly I really want to appreciate the effort. This is really helpful webpart. I am unable to add a link to a box

[hugoabernier]

Thank you, it means a lot!

Unfortunately, none of them allow a hyperlink embedded wihin the text, yet. You can, however, associate a hyperlink to a node in FlowChart and Mermaid diagrams:

Flowchart

The flowchart diagram allows you to associate a node with a URL by adding :> after the label.

Use the following syntax:

nodetype: NodeLabel:>Url[Target]

For example:

start: Start:>https://github.com

or

start: Start:>https://github.com[blank]

Mermaid

Add a click command at the end of your diagram indicating which node you wish to convert to a hyperlink. The hyperlink's text will be the text of the node.

Use the following syntax:

click NodeName "URL" "Tooltip"

For example:

click A "http://github.com"

Or:

click A "http://github.com" "Go to GitHub"

Will produce the following link:

You can associate a link to more than one node if you wish:

click A,B "http://github.com" "tooltip text"

Sequence

Do not support anchors yet. I'd have to make a PR to https://github.com/bramp/js-sequence-diagrams, but it sure would be a great idea.

I hope this helps?

[harshdamaniahd]

Thanks....it helps :-)

[harshdamaniahd]

It works for flowchart. I tried this for mermaid, but it doesn't work, also after adding link, the node text disappears

graph LR A[Square Rect] -- Link text --> B((Circle)) A --> C(Round Rect) B --> D{Rhombus} C --> D

click A "http://github.com" "Go to GitHub"

[hugoabernier]

Thanks for reporting this, I'll take a look at it tonight and let you know.

[hugoabernier]

@harshdamaniahd I've added the ability to enable HTML Labels for mermaid diagrams. Turns out that links are only rendered in HTML labels.

I hope this helps?