How is this one better? I thought this was going to be a visual editor where you click and edit on the diagram itself. I don't seem to be able to do that here.
Oh, finally, something that supports actual hierarchical state diagrams (that isn't Graphviz, no offense)... Mermaid's "You cannot define transitions between internal states belonging to different composite states" [1] has driven me up a wall for years.
I reached the same conclusion after comparing diagram-as-code tools — D2 feels cleaner and more expressive than Mermaid.
I’ve been working on an AI diagramming tool built around D2: https://aidiagrammaker.com/
You describe a system in plain English, and it generates architecture diagrams, flowcharts, and sequence diagrams in D2.
Edits can be made either directly in the D2 code or via a context-aware editor.
The language is richer and all diagram types are implemented consistently in the same language in a way that can be composed, as opposed to being a collection of unrelated DSLs.
The improved visual appearance is clear from inspecting example diagrams, I believe.
How does the agent session thing work? Server-side you proxy requests to client via websockets or something? How does the agent see the client-side data?
The first thing I tried to do is resize that rectangle in the default diagram... and the resize handles do not affect the height, only the width. What is this "better" than?
- Write Mermaid diagrams with a live preview.
- Arrange multiple diagrams on an infinite canvas.
- Group diagrams into multi-page projects.
- Better themes
How is this one better? I thought this was going to be a visual editor where you click and edit on the diagram itself. I don't seem to be able to do that here.
https://d2lang.com/ is a nicer language than Mermaid with much nicer visual appearance. It would be great if it became more widely supported.
Oh, finally, something that supports actual hierarchical state diagrams (that isn't Graphviz, no offense)... Mermaid's "You cannot define transitions between internal states belonging to different composite states" [1] has driven me up a wall for years.
shouldn't be that hard![1] https://mermaid.ai/open-source/syntax/stateDiagram.html#comp...
I agree that it's nicer and more powerful, but it's a little concerning it hasn't had any commits in the past 6 months: https://github.com/terrastruct/d2/commits/master/
I reached the same conclusion after comparing diagram-as-code tools — D2 feels cleaner and more expressive than Mermaid.
I’ve been working on an AI diagramming tool built around D2: https://aidiagrammaker.com/ You describe a system in plain English, and it generates architecture diagrams, flowcharts, and sequence diagrams in D2.
Edits can be made either directly in the D2 code or via a context-aware editor.
Does it produce real svgs as opposed to foreign object html in svg mess that mermaid compilers produce?
What makes it nicer?
Take a look at https://d2lang.com/examples/dagre/ and https://d2lang.com/tour/intro/
The language is richer and all diagram types are implemented consistently in the same language in a way that can be composed, as opposed to being a collection of unrelated DSLs.
The improved visual appearance is clear from inspecting example diagrams, I believe.
How does the agent session thing work? Server-side you proxy requests to client via websockets or something? How does the agent see the client-side data?
The first thing I tried to do is resize that rectangle in the default diagram... and the resize handles do not affect the height, only the width. What is this "better" than?
I will grant this: that's a brilliant name and domain.
- Write Mermaid diagrams with a live preview. - Arrange multiple diagrams on an infinite canvas. - Group diagrams into multi-page projects. - Better themes
Make no mistakes.
I can't seem to change the colors of the pie chart, other than the predefined themes. But all of those are horrible for a pie chart.
Yeah, as far as I know, you need to define a customized theme to customize pie chart colors. You can prepend the chart with initialization logic like:
%%{init: {"theme": "base", "themeVariables": { "pie1": "#FF5733", "pie2": "#33FF57", "pie3": "#3357FF", "pieStrokeColor": "#000000", "pieStrokeWidth": 3, "pieOpacity": 0.8 }}}%%
This looks like it works on this site too.
To be fair, pie charts are horrible in general.