I think this is a good change. While I would have preferred to see support for Graphviz over Mermaid, I understand Mermaid was probably chosen for the sake of easier integration. Either way, it will be nice to be able to embed diagrams rather than constantly re-generate and re-commit images to the repo.
Include diagrams in your Markdown files with Mermaid
11–20 of 272 posts
Re: Include diagrams in your Markdown files with Mermaid
#12I'm curious why they went for mermaid rather then GraphViz. Can anybody comment?
Re: Include diagrams in your Markdown files with Mermaid
#13I’m super excited for this! One thought though, on the syntax. Wouldn’t it be a bit odd if suddenly this line in a README.md: ```js const foo = 1 + 1 ``` Rendered as: `2` ? Isn’t that kind of what we’re doing here with the mermaid source tag? That tag is for showing source code, no? Feels like there should be another tag for rendering it.
Only the mermaid identifier is supported for triple backticks blocks, you can't put js and have it spit out script that executes in the browser.
Re: Include diagrams in your Markdown files with Mermaid
#14I think this is a good change. While I would have preferred to see support for Graphviz over Mermaid, I understand Mermaid was probably chosen for the sake of easier integration. Either way, it will be nice to be able to embed diagrams rather than constantly re-generate and re-commit images to the repo.
Has Graphviz been re-implemented in JavaScript or compiled to WASM?
Re: Include diagrams in your Markdown files with Mermaid
#15Thereby creating a hard dependency for your markdown files, obviating their portability.
The alternative is no diagram at all, which sucks for understanding, or linking to an image that's likely just a binary blob which is now a hard dependency on your markdown file too. Mermaid is a great fit, it's a text description of common graph types and it's meant to be read, written, and understood by humans in text form.
Re: Include diagrams in your Markdown files with Mermaid
#16I think this is a good change. While I would have preferred to see support for Graphviz over Mermaid, I understand Mermaid was probably chosen for the sake of easier integration. Either way, it will be nice to be able to embed diagrams rather than constantly re-generate and re-commit images to the repo.
Github will render org-mode markdown, so I've been making my documentation with it, and rendering graphviz diagrams using dot notation and org-mode's source code rendering capability. The rendered images are stored in your repo and show up inline.
Re: Include diagrams in your Markdown files with Mermaid
#17I think this is a good change. While I would have preferred to see support for Graphviz over Mermaid, I understand Mermaid was probably chosen for the sake of easier integration. Either way, it will be nice to be able to embed diagrams rather than constantly re-generate and re-commit images to the repo.
Has Graphviz been re-implemented in JavaScript or compiled to WASM?
There are definitely some JS libraries for it that exist. I don’t know all the details but I often find myself Googling “graphviz online” and clicking the first link to quickly mock up diagrams. So in short, I’ve used it on the web before.
Re: Include diagrams in your Markdown files with Mermaid
#18Gitlab supports mermaid too. It's always nice when there's feature parity between the two, as it makes it easier to jump between them.
Re: Include diagrams in your Markdown files with Mermaid
#19I’m super excited for this! One thought though, on the syntax. Wouldn’t it be a bit odd if suddenly this line in a README.md: ```js const foo = 1 + 1 ``` Rendered as: `2` ? Isn’t that kind of what we’re doing here with the mermaid source tag? That tag is for showing source code, no? Feels like there should be another tag for rendering it.
Only the mermaid identifier is supported for triple backticks blocks, you can't put js and have it spit out script that executes in the browser.
You missed the point, that being; isn't triple backticks meant for whitespace preserving, highlighted in certain cases source code? And not embedding other file types.
Re: Include diagrams in your Markdown files with Mermaid
#20sequencediagram.org is a pleasant (and free) tool for generating standalone diagrams like this outside of GitHub. I discovered it while helping Corrily with their docs, e.g. the diagram at the top of this page: https://docs.corrily.com/docs/price-optimization-overview