Links in Mermaid?

I see that you can embed links in Mermaid, and it seems to work for hyperlinks but calling functions doesn’t work, and fails silently. Is there something I should be doing differently?

Here’s the docs mermaid - Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.

and here’s a sample notebook trying to do the same : Links in Mermaid / Andrew Wooldridge / Observable
The hyperlink works, but the ‘callback’ functionality doesn’t, and there’s no error thrown as well.

It’s a bug with Stdlib’s mermaid integration. When a graph is initialized via .render(), the calling code has to take care of calling the bind functions. Documentation and example: API-Usage > Binding events

There’s still the problem though that functions are expected to be defined globally, so your callback examples wouldn’t have worked anyway, as window.callback is not defined. Perhaps stdlib can detect interpolated functions and replace them with random global aliases.

I hit the same snag and found that broken implementation.

Try this pattern I just figured out. It works for me.

1 Like