mermaid-js / mermaid-live-editor

Edit, preview and share mermaid charts/diagrams. New implementation of the live editor.
https://mermaid.live
MIT License
3.82k stars 574 forks source link

Mermaid diagram WYSIWYG GUI Editor #1438

Open AJNOURI opened 2 months ago

AJNOURI commented 2 months ago

Is your feature request related to a problem? Please describe.

We are relying more and more on Diagram as code concept and Mermaid, but coding complex diagrams from t0 is very heavy and daunting task. The idea is to create these diagrams using WYSIWYG web GUI editor that will be exported to mermaid code

Describe the solution you'd like

Overview:

The idea of the project is to create a web graphical user interface (GUI) tool that allows users to visually construct state diagrams which can then be automatically converted into Mermaid code. This tool is intended to simplify the process of creating state diagrams by providing an intuitive drag-and-drop interface where users can manipulate elements such as shapes and arrows to build complex diagrams directly compatible with Mermaid's syntax.

Functionality:

Features:

Canvas Operations:

Describe alternatives you've considered

I don't see alternatives

Additional context

Add any other context or screenshots about the feature request here.