Create Mermaid based on query data

I am trying to create mermaid diagrams based on data retrieved by a query. I struggle with the “inline mermaid code block” that I need to define inside the template block somehow. Has anybody done this?


This works:
```mermaid
flowchart LR
 Foo
 Bar
 Baz
```
This does not:

Some Data:
- Foo
- Bar
- Baz

```template
\`\`\`mermaid
flowchart LR
{{#each @item in {item where page = @page.name}}}
   {{@item.name}}
{{/each}}
\`\`\`
```

(I replaced tripple backticks with 2 backticks, otherwise the forum will not display the md properly)

1 Like

I’m guessing the expectation here is the mermaid chart would render out probably using github:silverbulletmd/silverbullet-mermaid/mermaid.plug.js (it is currently just text). This would be neat even for templating out programming language code examples.

@zef Thanks for the hint with ~~~. I updated the original post to contain the exact syntax now

Indeed I am trying to achieve what @meain was describing: Rendering a diagram that was generated based on data returned by a silverbullet query.

This is only one example (using mermaid plug) - however, I have several other use cases that would require a code block that is generated using a template to be handled the same as a ‘static’ code block.