Online Text to Diagram Tools | Hacker News Reader

Online Text to Diagram Tools

smusamashah.github.io

169 pointsilluminated30 comments

This could be life changing for me, very glad I found this.

But for people who want a use case: See that entry called svgbob? That’s pretty incredible. If you need a logo for a minor project, just throw some characters in a file and let it do its thing.

From the results there, it’ll generate something professional quality, and because it’s an SVG, as a logo, it will be superior to any jpg or png file, able to scale to any size without degradation.

This came up in the Graphviz discussion yesterday:

http://www.webgraphviz.com/

Another one that came up in the Graphviz discussion: https://edotor.net/

An interesting collection, but it would really benefit for an image for each tool. (Or even better, a code sample and image, side by side.)

Without a description, I have no idea, what is the input, outcome, are these popular, are these in active development, are these open source, etc.

That was a little too much work TBH because the tools keep changing. I put a minimal textual description which is way easier to maintain.

Everything keeps changing. Ang given that, (at least for me) it gives little advantage over a web search.

While more elaborate interactive lists (e.g. https://explorabl.es/ and https://p.migdal.pl/interactive-machine-learning-list/) might be more time consuming, putting screenshots isn't.

The list is about tools from textual descriptions, so is this collection. Having a textual description of syntax or ui makes some sense though.

Why don’t you capture the screenshots and send them to the author?

I've been experimenting with many of them and PlantUML is the best one I've used so far. It has a great feature set, and a lot of ways to define different alignment and styles of the diagrams.

There's also some interesting projects on GitHub for generated PlantUML diagrams, including this one: https://github.com/thibaultmarin/hpp2plantuml

This might be interesting for this post as well: https://fatiherikli.github.io/archetype/

This is doing to vice-versa, it allows you to create a text-based diagrams.

Thanks for this. Didn't know about this. Added to list.

I used MermaidJS for some diagram I wanted to add to some of my notes in Markdown, and it was simple enough and Joplin (markdown-based note-taking tool) added support not too long ago.

And you can also add Mermaid preview support to VSCode if that's something you want.

https://github.com/mjbvz/vscode-markdown-mermaid

https://marketplace.visualstudio.com/items?itemName=bierner....

So, I never tried to make text diagrams and the thought of doing it (by hand, I assume) haunts me:

How is it considered easy to build a simple table (or diagram) by having to hit keyboard keys and navigate the cursors to seemingly random places to place characters, while keeping the spacing, proportions, etc correct?

I don't like word processors but at least they recognize that if I drawing of building a table I need a different interaction model.

Maybe someone in this thread could highlight use cases where making text-diagrams (that may be later converted using these tools) is better than picking a richer text editor.

Markdown tables are bad. Apart from that, maintaining/updating a textual description is way more easier. Because its text, you can have simple version control over it

Making plain-text diagrams isn't as hard as you might think, especially using "overwrite mode" (that weird thing that happens when you fat-finger the insert key!)

But many of these tools work by allowing you to express the _intent_ of the diagram without having to draw it out. They're basically markup languages that get "compiled" into diagrams. PlantUML is a good example: http://www.plantuml.com/plantuml/uml/SyfFKj2rKt3CoKnELR1Io4Z.... With these tools, you can make diagrams much, much faster (but usually with less nuanced control over presentation)

I wish the author added a brief description for each entry and how they differ. I’m particularly interested to find out which is best for making networking topography diagrams. This is still useful nevertheless.

Look for the word 'network' in the list

I see it now, thank you!

Glad to see nomnoml on this list. I really appreciate the simplicity and it’s now my go-to for making diagrams.

I'd love on with a basic live collaboration feature. In Covid I'm really noticing the lack of a whiteboard and so long as you know what type of diagram you're doing from the outset I'm found doing something in Mermaid/similar to be much quicker than online whiteboards.

Given Mermaid is now supported in Azure DevOps, it's not crazy to think GitHub might support it in the future.

Also GitLab

I'm toying with the idea of using DAG representation of data in my app, and Diagram.Codes [1] did the trick to remind me how to _think_ in DAGs.

[1]: https://www.diagram.codes/d/graph

Check out https://plantuml.com/. It supports various types of diagrams.

I feel like this could've been a README.md in a github repo.. awesome list style

This list is missing diagrams.net (draw.io).

It doesn't generate diagrams from textual descriptions

looking for online erd tools (the mermaid.js one is close to being useful, but not quite)

tagged with entity-relationship

Great list!

Reply on news.ycombinator.com