Our great sponsors
-
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
-
(article author here) There's definitely nothing wrong with Mermaid. In fact, the current syntax at https://flowchart.fun can be converted to Mermaid (in export window) and I'll continue to support that when I migrate the app to the new syntax I'm proposing in this article.
The biggest differentiator is indenting to create edges, which I think is useful for some graphs and in some contexts (especially for quick brainstorming). Mermaid is great and super expressive.
That's interesting. It's not hard to see the problem. HTML labels don't help, either. How do other languages solve this? Like, a shell HERE document that has one fixed string as a terminator? The graphviz lexer https://gitlab.com/graphviz/graphviz/-/blob/main/lib/cgraph/... seems hackable but disabling downstream processing of escapes elsewhere would be necessary too. Possibly this would mean bypassing some of the processing in the function make_label in https://gitlab.com/graphviz/graphviz/-/blob/main/lib/common/...
It's a disappointment or even failure of our current language scanning and parsing tools or, really, the way we used them, that this is not an easy exercise.
One potential solution direction, which you can try out via my own incomplete drawing toy [1] is to treat punctuation characters like SP (“ “), COMMA (“,”), and SEMICOLON (“;”) as markers for the product operations of a family of monoids that allow you to specify more and more complicated sequences without requiring the typist to “move the cursor left” to add a matching character.
This way, simple lists can be specified via juxtaposition:
a b c
And then more complex lists
thing 1, thing 2, thing 3
and still more complex lists like
A complex thing; with data, and more data
can be specified in a way that is potentially still human-legible and easily editable.
Combined with ~instant feedback while typing and, ideally, a “brushing” system to allow selection of parts of the textual model via the linked drawing, I am hopeful that this can be solved resiliently, at least for the most common use cases.
(Part of why I am excited about OP’s work here though is that while I have done a fair bit in my own project on drawing a related kind of diagrams, I have myself only begun thinking about how to make the resulting drawings nicely stylable/themeable.)
[1] https://mstone.info/depict/ -> https://github.com/mstone/depict
That's sort of what https://flowchart.fun is. Although, it doesn't have as many graph types as PlantUML. Mermaid also has https://mermaid.live/ running in the browser.