Mermaid is a markup language for generating diagrams and flowcharts.
Mermaid allows for generation of diagrams and flowcharts from text in a similar manner as markdown.
You can check its Usage, Flowchart syntax and Sequence diagram syntax.
Questions tagged [mermaid]
118 questions
1
vote
0 answers
Mermaid flowchart layout
I have the following Mermaid code that renders the following diagram:
flowchart LR;
classDef socket fill:#f9f,stroke:#333,stroke-width:4px;
subgraph host1[Client Host]
subgraph "Client Process (Browser)"
app1[Browser…
Ron Inbar
- 1,460
- 1
- 10
- 18
1
vote
0 answers
How can i underline as apecific field in a graphviz record
Referring to How to underline text as part of a label? where underlining is explained.
Is ist possible to combine underlining with column-layout?
digraph g {
graph [ rankdir = "LR"];
node [
shape = "record"
];
"other" [
label =…
Ludwig Fuhr
- 55
- 5
1
vote
0 answers
Change mermaid theme preview on VSCode
I use mermaid for make diagrams in basic markdown documents and I want to change the default theme to the neutral theme. I use VSCode and Markdown enhanced preview extension. I tried to change the mermaid_config.js file adding "theme": "neutral".…
user13157078
- 15
- 4
1
vote
0 answers
How to produce mermaid flowcharts that contain a title and description per node
I am working on ROS robots. I wanted to document the launchfiles using mermaid. Some things in these xml files would best fit into the same node like:
Name
Type
Description
...
Adding them as separate nodes would make th diagrams really…
Stefan Schmelz
- 41
- 4
1
vote
1 answer
Typora, change font of text on links in graph mermaid
graph TD;
A[Hello]--Change_font-->B[of_text]
I want to change the font(color, size...) of the text on the link(Change_font), but I am not able to figure out. Can someone help??
flowchart
Beast_Levi
- 56
- 4
1
vote
3 answers
How do you specify Mermaid configuration within Gitlab Markdown?
In Gitlab, I've been able to render an Entity Relationship Diagram with Mermaid in a Markdown file as specified here.
This is the Markdown I used:
```mermaid
erDiagram
CUSTOMER }|..|{ DELIVERY-ADDRESS : has
CUSTOMER ||--o{ ORDER :…
John D
- 326
- 3
- 6
1
vote
1 answer
Installing mermaid on svelte
I'm trying to install Mermaid with Svelte to make graphs. So I did the following:
npm install mermaid
Then I get the following:
npm WARN svelte-app@1.0.0 No repository field.
npm WARN svelte-app@1.0.0 No license field.
+ mermaid@8.5.2
updated 1…
Evgeniya
- 23
- 3
1
vote
2 answers
How can I change font / colors in mermaid.js Gantt
I recently discovered mermaid.js which is great to design graphs and Gantts.
I'm using the live editor (https://mermaid-js.github.io/mermaid-live-editor/) and it's quite easy.
But how can I simply change the text font and its size, colors of the…
Tomane
- 53
- 1
- 1
- 7
1
vote
2 answers
Azure DevOps Mermaid labels not centered
Question
Is it possible to change my Azure DevOps wiki's Mermaid configurations? Or is there any other way for me to get my desired result on my wiki?
Desired Result:
Details
Using the Mermaid markdown in an Azure DevOps wiki, the label in the…
Nifim
- 3,437
- 11
- 21
1
vote
1 answer
Maximum Text Size In Diagram Exceeded
I am using mermaid 8.5.0 to generate flowchart, but getting error message Maximum Text Size In Diagram Exceeded.
Saved MD to text document and size of document is 60kb.
So wanted to find out if there is any configuration which can allow to accept…
Rajnikant
- 1,501
- 13
- 19
1
vote
1 answer
Mermaid and MMD in BBEdit?
I'm a noob in scripting (for years now...) and a BBEdit fan user. I usually find solutions to my problems on StackO or GitH, but this time I do not, and I finally decide to create an account. First post on Stackoverflow ! So stressful !
BBEdit works…
GGB_C_
- 11
- 1
1
vote
1 answer
Problem using mermaid.cli in Sphinx on Windows
I have a simple Sphinx project where I'd like to be able to render my Mermaid charts as png. To do so, I have installed the mermaid.cli via yarn, but I've not managed to get it to work.
My attempts
I've tried various combinations:
I've tried…
mfcss
- 365
- 2
- 13
1
vote
0 answers
Using UML in doxygen markdown page
I am using doxygen for my personal project and desire to use any type of UML language on page created by myself (markdown page). I do not mean to use it in code (it does work), but on a document created by myself, refer to example underneath:
#…
Black
- 135
- 1
- 12
1
vote
1 answer
How to type in multiple spaces in mermaid?
I'm using VS-Code to edit my markdown file, and need to make flowcharts (graph) to display workflow.
The problem is VS-Code will not properly display the long text title, the last few part will be truncated as showed in follow:
```mermaid
graph…
Shore
- 559
- 2
- 12
1
vote
0 answers
Trouble installing mermaid command line interface
I'm trying to use the mermaid tool to build diagrams. I installed on windows using,
yarn add mermaid
after first downloading scoop and yarn.
And then, to get the command line interface I used,
yarn add mermaid.cli
./node_modules/.bin/mmdc…
KalBaratheon
- 62
- 6