Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Include diagrams in your Markdown files with Mermaid

github.blog

Post reply on HN
Print view View original

111–120 of 272 posts

Re: Include diagrams in your Markdown files with Mermaid

#111

Post by tannhaeuser »

Someone wrote: post #82

I like markdown, and can see the lure of additions such as this one, but I also sometimes wonder whether we gained much compared to troff and its companion programs ( pic , eqn , tbl , chem , etc. See https://www.troff.org/prog.html ). If we added Unicode support and html and pdf output to those, I think the main thing we would miss is readability of the raw text. That doesn’t look like much progress in half a centur…

> That doesn’t look like much progress in half a century.

Considering the author of groff became the SGML expert, with SGML supporting custom syntax parsing ranging from troff-like line commands all the way to markdown or Wikimedia syntax or subsets thereof precisely for unifying ad-hoc syntax, and SGML the basis for the HTML vocabulary from which these want to run away, I'd rather say tech is re-invented in generational circles. Or devs simply like to grow mini languages ;)

Re: Include diagrams in your Markdown files with Mermaid

#112

Post by ygra »

donatj wrote: post #90
WalterGR wrote: post #14

Earlier quoted context omitted.

Has Graphviz been re-implemented in JavaScript or compiled to WASM?

It's a simple well documented language. Righting a fully functional JS Graphviz parser from scratch would take a couple days at most.

Having tried to think about how to map Graphviz (language parsing, styles, and layout) onto our graph drawing offering, I'm not sure I can agree here. The dot graph description language itself is fairly simple (-ish). There are a few nasties like the HTML record support, which can be annoying to support, but overall that part isn't so bad. When it comes to laying out the graphs and rendering anything Graphviz has so many unique features that it can be a lot more work.

Re: Include diagrams in your Markdown files with Mermaid

#113

Post by smasher164 »

I like this approach of using the tag associated with a code block to determine how to render the output. It's the same approach I take in my markdown-derived markup language: https://github.com/smasher164/mexdown.

The top example there takes a GraphViz description and passes it into the dot command, placing the resultant SVG into the HTML output.

Re: Include diagrams in your Markdown files with Mermaid

#115

Post by schemescape »

WalterGR wrote: post #14
jonpalmisc wrote: post #11

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.

Has Graphviz been re-implemented in JavaScript or compiled to WASM?

Yes, several times:

http://viz-js.com/

https://www.npmjs.com/package/@hpcc-js/wasm

I even did it myself a few months ago :)

Re: Include diagrams in your Markdown files with Mermaid

#117

Post by brainfish »

dijit wrote: post #92
Arnavion wrote: post #80

Earlier quoted context omitted.

It's nice to have the diagram source in the same file that uses it, instead of a separate file that needs to be kept in sync.

Since it’s sufficiently different to how it’s rendered its really more like an SVG than a table. So, the question is would you rather have SVGs inline? Personally I think the reference to another file is a perfectly fine compromise, as the content is sufficiently different to no longer be markdown.

I think this is a false equivalence. The content of SVGs is non-semantic; to get from SVG code to Meaning one needs to do some sort of rendering and re-interpreting of the resulting image. Even if for some simple images that could be done in-brain, that is not usually the case. Whereas something like Mermaid is intended to be meaningful both as code and as rendered output, just like Markdown itself. Having that additional meaning inline can be very helpful to faster understanding of the content, which is not usually going to be the case for inline'd SVG.

Re: Include diagrams in your Markdown files with Mermaid

#118

Post by yu-carm-kror »

avgcorrection wrote: post #32

I 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…

If I need something to look good as text without any rendering I write text (a .txt file). Even the most basic features of markdown (inline code, italics, etc) look pretty nasty without post rendering.
Post reply on HN