Adding a ticket for this :)
HN user
knsv
Creator of Mermaid, CTO and founder of Mermaid Chart
Using the extension, you can see your changes from the Mermaid Code rendered as a diagram in real-time.
If you also want to interact with the diagram itself to make the changes, you can do that using the Mermaid Chart Playground: https://www.mermaidchart.com/play
No it can not. That's an interesting idea, though, but one would need to navigate/differentiate between the rendered output text and the Mermaid diagram code.
Hi, I wanted to add some clarification on this topic.
I am Knut Sveidqvist, the inventor of Mermaid and creator of the Mermaid open-source project. I'm also the co-founder of Mermaid Chart.
To address the confusion: Mermaid Chart is not a separate entity "profiting off the name" - it's a commercial offering I created to help sustain the open-source project. Working on Mermaid during evenings and weekends became unsustainable as the project grew. Mermaid Chart allows me to work on what I love full-time while providing resources back to the open-source project. This support will continue to grow as our business matures.
I appreciate your concern about protecting users from deceptive practices. In this case, there is a direct connection between the open-source project and the commercial offering, created by the same founding team.
More good input! Appreciate it. What about PNG export? It seems more direct than a PDF to me.
That's good feedback. The icons are not bundled into Mermaid itself due to copyright concerns. The approach you suggest would make sense, though.
You are right! A light plugin was released then.
Now, we have added lots of new functionality. Proper editing with syntax highlighting, etc. Apart from that, we have also added integration with GitHub Copilot, so you can generate diagrams from code and continue to edit them using the extension.
Yes
Thanks, I uploaded it!
Yes! You can use this in the free mermaid playground: https://www.mermaidchart.com/play
Agree but we are changing things up to make this easier.
In the upcoming Mermaid version 11, we are adding a way to select which layout algorithm is used to layout the diagram. We are also making it easier to add additional layout algorithms.
Hopefully, this will be easier going forward!
Glad you love Mermaid!
As both the creator of Mermaid and the founder of Mermaid Chart, I can honestly say that both are close to my heart. My hope with Mermaid Chart was to spend more daytime hours working with Mermaid, improving it, and making some structure changes that were needed to continue to grow.
Since Mermaid Chart started in 2022 Mermaid Chart has enabled this. I believe this development is incredibly beneficial for the open-source project too. Our strategy involves Mermaid Chart consistently reinvesting resources and development efforts into the open-source project.
In addition, we hope to make it easier to use Mermaid itself. These services are provided by Mermaid Chart on top of Mermaid JS.
/Knut
Mermaid Chart introduces a new Visual Editor for flowcharts, enabling users of all skill levels to create diagrams easily and efficiently, with both GUI and code-based editing options.
Knut, Mermaid's creator here.
I agree that layout auto-adjustments in flowcharts can be problematic, especially when subgraphs represent architectural subsystems as they are not really flowcharts. :)
I'm developing a new Mermaid diagram type for more layout control, with precise block placement.
Some thoughts on special cases, a love-hate relationship, I guess :)
Good point. Finding a middle ground is the way to go. Keeping enough details in the diagrams to keep them useful but without the extra overhead. You cant keep all the details in the diagrams, they belong in the code.
New Integration Enhances Workflows By Enabling Developers To Reference And Edit Diagrams Within Visual Studio Code.
Mermaid Chart’s new ChatGPT plugin integrates AI-powered text prompts with Mermaid’s intuitive diagramming editor, enabling users to generate, edit, and share complex diagrams with ease and efficiency.
The problem with state machines that I run into often when using them, is "multi-dimensional" states.
When managing to get that right they are great, otherwise you get loads of edges...
Thanks I am happy to hear that!
Was it easier the second time around? :)
I agree, not having to be an expert in order to understand is important!
Sequence diagrams really shine when you’re documenting different parts of a system and the various ways these parts interact with each other.
Now you can show your manager what to select - just like the strategy consultants at BCG do
Documentation tends to be bad because companies and projects don’t fully realize the costs of bad documentation.
I fully agree! When designing solving a problem it great to take a step back and think through the states you can end up in. Although it is easy to make the machine overly complex when you have "multi-dimensional" states unless to are a little bit carful with how you model it.
That looks really cool.
I find that I write most diagrams for myself as a reader. It takes much less time to get an overview some logic I have not touched in a while when there is a diagram to start with. Once I remember the big picture I dig deeper via the code.
Creator of Mermaid here. Great input, quite inspiring! Here are another example of how ChatGPT chart can be integrated with Mermaid and by this having of tediousness with creating diagrams removed: https://www.mermaidchart.com/blog/posts/if-youre-not-excited...
Good summary @moonreds, I fully agree.
For the styling we can't really compete with the visual tools. In Mermaid we have lots of things we can do in that area to make it better though. Both improving the default styling and handling some common use-cases. We could for instance simplify the highlighting of one specific node in a flowchart/class diagram. You can do it right now ofc but you have to make the style/class yourself.
One should be also be aware though that there is a time trap using styling in the visual tools. I spent lots of time making fiddling with styling of boxes in Visio. :)
--- Creator of Mermaid and founder of Mermaid Chart