Hacker Read top | best | new | newcomments | leaders | about | bookmarklet login

Very nice! I've just started playing with Kroki.io (a "universal" API over many diagramming libs including mermaid and excalidraw).


sort by: page size:

If you start getting into this kind of thing, you'll want to take a look at https://kroki.io which supports Mermaid along with lots of other diagramming formats.

Just saw you have Mermaid integration. I'm a heavy diagrammer, so thanks for that! Any thoughts on integrating with draw.io?

Mermaid lets you create diagrams using code. Really nice.

I use mermaid.js heavily, but plug for Kroki:

https://kroki.io/

“Kroki provides a unified API with support for BlockDiag (BlockDiag, SeqDiag, ActDiag, NwDiag, PacketDiag, RackDiag), BPMN, Bytefield, C4 (with PlantUML), D2, DBML, Ditaa, Erd, Excalidraw, GraphViz, Mermaid, Nomnoml, Pikchr, PlantUML, Structurizr, SvgBob, Symbolator, TikZ, UMLet, Vega, Vega-Lite, WaveDrom, WireViz... and more to come!”

Besides Mermaid, of special note: BPMN, D2, Excalidraw, and Structurizr.


Checkout kroki as well which is collection of various tools including plantuml, tikz, mermaidjs, graphvi etc.

As a bonus, niolesk is a very good frontend on top of kroki. You get an editable link of your diagram which you can share with teammates.

You can find docker image on github running kroki and niolesk.


Definitely an advancement over draw.io however isnt this just mermaid diagrams?

I have used Mermaid diagrams quite a bit lately because ChatGPT can generate them. It's been an easy way to get it to visualize things before I have access to the image generation stuff. It works really well, try it if you haven't!

I only wish the renderer could render "sketch" style like Excalidraw, I don't like the default appearance. Obviously a small detail, though.


Nice! This would be super cool when applied to some nice diagramming libraries like Mermaid and Markdeep.

https://github.com/knsv/mermaid

https://casual-effects.com/markdeep


draw.io/diagrams.net has a mermaid plugin

https://github.com/nopeslide/drawio_mermaid_plugin


This looks nice. Personally I prefer draw.io desktop version for large complex diagrams, and use mermaid for smaller diagrams such as sequence diagrams.

I like this! I'd love it if Github rendered Mermaid diagrams in their Markdown.

Mermaid would not be my first choice of diagramming software (that would be plain old Graphviz with PlantUML for more full featured graphs), but I'm glad to see some diagramming support on GitHub natively. There's already quite a few tools that let you embed via hotlink or generated link your graph.

[1] https://graphviz.org/ [2] https://plantuml.com/


I had just learned about Mermaid and used it standalone once, when I realized it is also already built into Github Markdown [0], where you can include a diagram by just going ```mermaid <code>```, which is veeery handy. In mermaid.live can also get an SVG URL which works great to paste into many online drawing tools like Miro, Diagrams.net etc.

[0] https://docs.github.com/en/get-started/writing-on-github/wor...


I can't fathom what this has over kroki, plantuml, or diagrams.py, mermaid

I really love Mermaid Diagrams. This is one of the best libraries to come out. I'm writing a book, and being able to generate diagrams with mermaid and then customize the CSS to meet the guidelines from my editor has been fantastic. I've started including a lot more diagrams in my projects and documentation as well. It's just such a good tool.

In case it helps as a tool recommendation, I’ve had some success having ChatGPT writing & rendering MermaidJS (diagrams as code)

mermaid also has different syntax for each diagram type.

gleek.io is unifying the syntax throughout different diagram types so that you don't have to learn the syntax from the beginning again.


Thanks for mentioning mermaid.js. I am bookmarking this and excited to try it.

I’ve always loved https://sequencediagram.org for creating sequence diagrams with text (highly recommend btw), but have also wanted to create other diagram types in a similar manner. Mermaid.js looks super intriguing.


No diagrams yet, but I have plans of integrating Mermaidjs. I will have a look at PlantUML.
next

Legal | privacy