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

Show HN: Mermaid ASCII Diagrams

mermaid-ascii.art

Post reply on HN
Print view View original

1–10 of 54 posts

Re: Show HN: Mermaid ASCII Diagrams

#3

Post by quuxplusone »

Some nits:

The "Example" buttons don't jump out at me; I found them but it took a while. Also consider labeling them with their point, e.g. "Example 3: Color"

If you change the input text to something well-formed, the graph seems to update immediately. But if you change it to something ill-formed, the graph doesn't update immediately — and then if you click "Generate" manually, it blanks the input box. Either this is a bug, or the "Generate" button doesn't do what I think it does (i.e. generate output). Again, adding a noun to the verb might help. Or just adding some usage information somewhere on the page.

For those like me who've never heard of "Mermaid," apparently it's like GraphViz's dot language but different. https://github.com/mermaid-js/mermaid I tried the flowchart example from Mermaid's own README, but it didn't come out right: looks like the shape characters [] and {} aren't handled.

Re: Show HN: Mermaid ASCII Diagrams

#4

Post by AlexanderGrooff »

quuxplusone wrote: post #3

Some nits: The "Example" buttons don't jump out at me; I found them but it took a while. Also consider labeling them with their point, e.g. "Example 3: Color" If you change the input text to something well-formed, the graph seems to update immediately. But if you change it to something ill-formed, the graph doesn't update immediately — and then if you click "Generate" manually, it blanks the input box. Either this is…

Thanks for the feedback! I agree that the web UI can be improved (quite) a bit, most of my efforts went into the actual generation of the diagrams. I'll have a look at prettifying it.
Post reply on HN