Include diagrams in your Markdown files with Mermaid
171–180 of 272 posts
Re: Include diagrams in your Markdown files with Mermaid
#172Earlier quoted context omitted.
I agree. R Markdown has R code execution as part of it's Markdown flavor and it distinguishes code block vs code execution as ```R vs ```{R}
It feels like Markdown and Jupyter notebooks in on the path to merging, and markdown is like the dumbed (need a different word for this, simplicated (though that that word is cumbersome)) down yaml which is a simplicated xml. Why don't we just go back to xml and provide decent structured editors?
Re: Include diagrams in your Markdown files with Mermaid
#173I’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.
```math
-b \pm \sqrt{b^2 - 4ac} \over {2a}
```
So to some extent the rendering is advanced syntax highlighting. I wonder where you would draw the monospace text vs rendered line on this spectrum? JavaScript ; poem ; ’90s email ; OP ; latex math ; ditaa
I guess you’d put it at the end with nothing being rendered?Re: Include diagrams in your Markdown files with Mermaid
#174Earlier quoted context omitted.
While I agree, formatting languages like Mermaid or PlantUML are human readable enough to grasp them and their meaning from reading the textual form. And, as others below point out, editability is another great treat of Markdown. ASCII charts are very hard to format; you'll really need tools or editor plugins for that. So I think that Mermaid (and PlantUML) strike a very pragmatic and human-friendly balance. Which, I…
> ASCII charts are very hard to format; you'll really need tools or editor plugins for that. Even with tools and plugins, creating tables in Markdown (in any flavor) is painful enough that I just don't even try. No one really expects to edit an image with a text editor but tables are tantalizing close. I'd sooner have ASCII inspired tables that are easier to edit than images and diagrams.
Re: Include diagrams in your Markdown files with Mermaid
#175I think so-called ASCII-art is more in the spirit of Markdown. The nice thing about the original Markdown (modulo bugs) is that things are written the way one would write plaintext documents which are supposed to be easily read in a text editor. So you don’t write bullet lists like this: - Bullet 1 - Bullet 2 - Bullet 3 And hope that some post-processing will add linebreaks for you. You write it like this: - Bullet 1…
I agree that ASCII-art definitely is more cenetered around the original markdown spirit but I personally struggle making my ASCII-art diagrams in Vim. Looking at the mermaid, syntax it looks like I can whip up something equivalent really quick. As a developer I also don't mind that the mermaid syntax reads like pseudocode so it's probably easy for me to digest.
Re: Include diagrams in your Markdown files with Mermaid
#176I’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.
```!dot
(Markup)
```
I wish they’d adopted something like that instead - I have no idea how you’d include highlighted Mermaid source in a GH markdown file.Re: Include diagrams in your Markdown files with Mermaid
#177I think so-called ASCII-art is more in the spirit of Markdown. The nice thing about the original Markdown (modulo bugs) is that things are written the way one would write plaintext documents which are supposed to be easily read in a text editor. So you don’t write bullet lists like this: - Bullet 1 - Bullet 2 - Bullet 3 And hope that some post-processing will add linebreaks for you. You write it like this: - Bullet 1…
Re: Include diagrams in your Markdown files with Mermaid
#178Earlier quoted context omitted.
> readable-as-text goals of markdown. Markdown was meant to be rendered, not left as plaintext (for viewing, at least as a primary use-case). It's name is a punny joke, but it's a lightweight mark up language that was meant to be a lightweight way to write formatted text that would be rendered as formatted HTML. GFM seems in keeping with this for the most part.
> Markdown was meant to be rendered, not left as plaintext (for viewing, at least as a primary use-case). [...] meant to be a lightweight way […] No, that was not the primary design goal. > The overriding design goal for Markdown’s formatting syntax is to make it as readable as possible. The idea is that a Markdown-formatted document should be publishable as-is, as plain text, without looking like it’s been marked up…
> Markdown’s syntax is intended for one purpose: to be used as a format for writing for the web. [1]
[1] https://daringfireball.net/projects/markdown/syntax#html
Re: Include diagrams in your Markdown files with Mermaid
#179Re: Include diagrams in your Markdown files with Mermaid
#180Earlier quoted context omitted.
To be fair, I'm not sure "offline readability" is an actual problem anymore. VS Code and (presumably) other IDEs offer a very simple live-preview window for viewing and editing markdown files.
We need to go back to something like Word documents. We’ve come full circle