mirror of
https://github.com/mermaid-js/mermaid.git
synced 2025-11-12 00:34:10 +01:00
Fix docs, mmd -> mermaid
This commit is contained in:
@@ -40,7 +40,7 @@ It is also possible to override site-wide theme settings locally, for a specific
|
|||||||
|
|
||||||
**Following is an example:**
|
**Following is an example:**
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
%%{init: {'theme':'base'}}%%
|
%%{init: {'theme':'base'}}%%
|
||||||
graph TD
|
graph TD
|
||||||
a --> b
|
a --> b
|
||||||
@@ -56,7 +56,7 @@ The easiest way to make a custom theme is to start with the base theme, and just
|
|||||||
|
|
||||||
Here is an example of overriding `primaryColor` and giving everything a different look, using `%%init%%`.
|
Here is an example of overriding `primaryColor` and giving everything a different look, using `%%init%%`.
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
%%{init: {'theme': 'base', 'themeVariables': { 'primaryColor': '#ff0000'}}}%%
|
%%{init: {'theme': 'base', 'themeVariables': { 'primaryColor': '#ff0000'}}}%%
|
||||||
graph TD
|
graph TD
|
||||||
A[Christmas] -->|Get money| B(Go shopping)
|
A[Christmas] -->|Get money| B(Go shopping)
|
||||||
|
|||||||
@@ -75,7 +75,7 @@ When deployed within code, init is called before the graph/diagram description.
|
|||||||
|
|
||||||
**for example**:
|
**for example**:
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
%%{init: {"theme": "default", "logLevel": 1 }}%%
|
%%{init: {"theme": "default", "logLevel": 1 }}%%
|
||||||
graph LR
|
graph LR
|
||||||
a-->b
|
a-->b
|
||||||
|
|||||||
@@ -84,7 +84,7 @@ Here the directive declaration will set the `logLevel` to `debug` and the `theme
|
|||||||
|
|
||||||
Note: You can use 'init' or 'initialize' as both acceptable as init directives. Also note that `%%init%%` and `%%initialize%%` directives will be grouped together after they are parsed. This means:
|
Note: You can use 'init' or 'initialize' as both acceptable as init directives. Also note that `%%init%%` and `%%initialize%%` directives will be grouped together after they are parsed. This means:
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
%%{init: { 'logLevel': 'debug', 'theme': 'forest' } }%%
|
%%{init: { 'logLevel': 'debug', 'theme': 'forest' } }%%
|
||||||
%%{initialize: { 'logLevel': 'fatal', "theme":'dark', 'startOnLoad': true } }%%
|
%%{initialize: { 'logLevel': 'fatal', "theme":'dark', 'startOnLoad': true } }%%
|
||||||
...
|
...
|
||||||
|
|||||||
@@ -248,7 +248,7 @@ classE o-- classF : aggregation
|
|||||||
|
|
||||||
Relations can logically represent an N:M association:
|
Relations can logically represent an N:M association:
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
classDiagram
|
classDiagram
|
||||||
Animal <|--|> Zebra
|
Animal <|--|> Zebra
|
||||||
```
|
```
|
||||||
@@ -351,7 +351,7 @@ class Color{
|
|||||||
|
|
||||||
Comments can be entered within a class diagram, which will be ignored by the parser. Comments need to be on their own line, and must be prefaced with `%%` (double percent signs). Any text until the next newline will be treated as a comment, including any class diagram syntax.
|
Comments can be entered within a class diagram, which will be ignored by the parser. Comments need to be on their own line, and must be prefaced with `%%` (double percent signs). Any text until the next newline will be treated as a comment, including any class diagram syntax.
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
classDiagram
|
classDiagram
|
||||||
%% This whole line is a comment classDiagram class Shape <<interface>>
|
%% This whole line is a comment classDiagram class Shape <<interface>>
|
||||||
class Shape{
|
class Shape{
|
||||||
@@ -417,7 +417,7 @@ classDiagram
|
|||||||
|
|
||||||
_URL Link:_
|
_URL Link:_
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
classDiagram
|
classDiagram
|
||||||
class Shape
|
class Shape
|
||||||
link Shape "https://www.github.com" "This is a tooltip for a link"
|
link Shape "https://www.github.com" "This is a tooltip for a link"
|
||||||
@@ -427,7 +427,7 @@ click Shape2 href "https://www.github.com" "This is a tooltip for a link"
|
|||||||
|
|
||||||
_Callback:_
|
_Callback:_
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
classDiagram
|
classDiagram
|
||||||
class Shape
|
class Shape
|
||||||
callback Shape "callbackFunction" "This is a tooltip for a callback"
|
callback Shape "callbackFunction" "This is a tooltip for a callback"
|
||||||
|
|||||||
@@ -116,7 +116,7 @@ Relationships may be classified as either _identifying_ or _non-identifying_ and
|
|||||||
| to | _identifying_ |
|
| to | _identifying_ |
|
||||||
| optionally to | _non-identifying_ |
|
| optionally to | _non-identifying_ |
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
erDiagram
|
erDiagram
|
||||||
CAR ||--o{ NAMED-DRIVER : allows
|
CAR ||--o{ NAMED-DRIVER : allows
|
||||||
PERSON ||--o{ NAMED-DRIVER : is
|
PERSON ||--o{ NAMED-DRIVER : is
|
||||||
|
|||||||
@@ -273,7 +273,7 @@ word of warning, one could go overboard with this making the flowchart harder to
|
|||||||
markdown form. The Swedish word `lagom` comes to mind. It means, not too much and not too little.
|
markdown form. The Swedish word `lagom` comes to mind. It means, not too much and not too little.
|
||||||
This goes for expressive syntaxes as well.
|
This goes for expressive syntaxes as well.
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
flowchart TB
|
flowchart TB
|
||||||
A --> C
|
A --> C
|
||||||
A --> D
|
A --> D
|
||||||
@@ -557,7 +557,7 @@ Beginner's tip—a full example using interactive links in a html context:
|
|||||||
|
|
||||||
Comments can be entered within a flow diagram, which will be ignored by the parser. Comments need to be on their own line, and must be prefaced with `%%` (double percent signs). Any text after the start of the comment to the next newline will be treated as a comment, including any flow syntax
|
Comments can be entered within a flow diagram, which will be ignored by the parser. Comments need to be on their own line, and must be prefaced with `%%` (double percent signs). Any text after the start of the comment to the next newline will be treated as a comment, including any flow syntax
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
flowchart LR
|
flowchart LR
|
||||||
%% this is a comment A -- text --> B{node}
|
%% this is a comment A -- text --> B{node}
|
||||||
A -- text --> B -- text2 --> C
|
A -- text --> B -- text2 --> C
|
||||||
|
|||||||
@@ -193,7 +193,7 @@ More info in: [https://github.com/d3/d3-time#interval_every](https://github.com/
|
|||||||
|
|
||||||
The compact mode allows you to display multiple tasks in the same row. Compact mode can be enabled for a gantt chart by setting the display mode of the graph via preceeding YAML settings.
|
The compact mode allows you to display multiple tasks in the same row. Compact mode can be enabled for a gantt chart by setting the display mode of the graph via preceeding YAML settings.
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
---
|
---
|
||||||
displayMode: compact
|
displayMode: compact
|
||||||
---
|
---
|
||||||
@@ -211,7 +211,7 @@ gantt
|
|||||||
|
|
||||||
Comments can be entered within a gantt chart, which will be ignored by the parser. Comments need to be on their own line and must be prefaced with `%%` (double percent signs). Any text after the start of the comment to the next newline will be treated as a comment, including any diagram syntax.
|
Comments can be entered within a gantt chart, which will be ignored by the parser. Comments need to be on their own line and must be prefaced with `%%` (double percent signs). Any text after the start of the comment to the next newline will be treated as a comment, including any diagram syntax.
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
gantt
|
gantt
|
||||||
title A Gantt Diagram
|
title A Gantt Diagram
|
||||||
%% this is a comment
|
%% this is a comment
|
||||||
|
|||||||
@@ -387,7 +387,7 @@ sequenceDiagram
|
|||||||
|
|
||||||
Comments can be entered within a sequence diagram, which will be ignored by the parser. Comments need to be on their own line, and must be prefaced with `%%` (double percent signs). Any text after the start of the comment to the next newline will be treated as a comment, including any diagram syntax
|
Comments can be entered within a sequence diagram, which will be ignored by the parser. Comments need to be on their own line, and must be prefaced with `%%` (double percent signs). Any text after the start of the comment to the next newline will be treated as a comment, including any diagram syntax
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
sequenceDiagram
|
sequenceDiagram
|
||||||
Alice->>John: Hello John, how are you?
|
Alice->>John: Hello John, how are you?
|
||||||
%% this is a comment
|
%% this is a comment
|
||||||
@@ -443,7 +443,7 @@ This can be configured by adding one or more link lines with the format:
|
|||||||
link <actor>: <link-label> @ <link-url>
|
link <actor>: <link-label> @ <link-url>
|
||||||
```
|
```
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
sequenceDiagram
|
sequenceDiagram
|
||||||
participant Alice
|
participant Alice
|
||||||
participant John
|
participant John
|
||||||
|
|||||||
@@ -249,7 +249,7 @@ Comments can be entered within a state diagram chart, which will be ignored by t
|
|||||||
own line, and must be prefaced with `%%` (double percent signs). Any text after the start of the comment to the next
|
own line, and must be prefaced with `%%` (double percent signs). Any text after the start of the comment to the next
|
||||||
newline will be treated as a comment, including any diagram syntax
|
newline will be treated as a comment, including any diagram syntax
|
||||||
|
|
||||||
```mmd
|
```mermaid
|
||||||
stateDiagram-v2
|
stateDiagram-v2
|
||||||
[*] --> Still
|
[*] --> Still
|
||||||
Still --> [*]
|
Still --> [*]
|
||||||
|
|||||||
Reference in New Issue
Block a user