mirror of
				https://github.com/mermaid-js/mermaid.git
				synced 2025-11-04 12:54:08 +01:00 
			
		
		
		
	Merge branch 'develop' into feature/3173_implement_until_keyword_in_gantt
This commit is contained in:
		@@ -217,18 +217,18 @@ Communication tools and platforms
 | 
			
		||||
 | 
			
		||||
### Browser Extensions
 | 
			
		||||
 | 
			
		||||
| Name                     | Chrome Web Store                                                                                             | Firefox Add-ons                                                                | Opera                                                                          | Edge                                                                                                                         | Source/Repository                                                                                    |
 | 
			
		||||
| ------------------------ | ------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------ | ------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------- |
 | 
			
		||||
| GitHub + Mermaid         | -                                                                                                            | [🦊🔗](https://addons.mozilla.org/firefox/addon/github-mermaid/)               | -                                                                              | -                                                                                                                            | [🐙🔗](https://github.com/BackMarket/github-mermaid-extension)                                       |
 | 
			
		||||
| Asciidoctor Live Preview | [🎡🔗](https://chrome.google.com/webstore/detail/asciidoctorjs-live-previe/iaalpfgpbocpdfblpnhhgllgbdbchmia) | -                                                                              | -                                                                              | [🌀🔗](https://microsoftedge.microsoft.com/addons/detail/asciidoctorjs-live-previ/pefkelkanablhjdekgdahplkccnbdggd?hl=en-US) | -                                                                                                    |
 | 
			
		||||
| Diagram Tab              | -                                                                                                            | -                                                                              | -                                                                              | -                                                                                                                            | [🐙🔗](https://github.com/khafast/diagramtab)                                                        |
 | 
			
		||||
| Markdown Diagrams        | [🎡🔗](https://chrome.google.com/webstore/detail/markdown-diagrams/pmoglnmodacnbbofbgcagndelmgaclel/)        | [🦊🔗](https://addons.mozilla.org/en-US/firefox/addon/markdown-diagrams/)      | [🔴🔗](https://addons.opera.com/en/extensions/details/markdown-diagrams/)      | [🌀🔗](https://microsoftedge.microsoft.com/addons/detail/markdown-diagrams/hceenoomhhdkjjijnmlclkpenkapfihe)                 | [🐙🔗](https://github.com/marcozaccari/markdown-diagrams-browser-extension/tree/master/doc/examples) |
 | 
			
		||||
| Markdown Viewer          | -                                                                                                            | [🦊🔗](https://addons.mozilla.org/en-US/firefox/addon/markdown-viewer-chrome/) | -                                                                              | -                                                                                                                            | [🐙🔗](https://github.com/simov/markdown-viewer)                                                     |
 | 
			
		||||
| Extensions for Mermaid   | -                                                                                                            | -                                                                              | [🔴🔗](https://addons.opera.com/en/extensions/details/extensions-for-mermaid/) | -                                                                                                                            | [🐙🔗](https://github.com/Stefan-S/mermaid-extension)                                                |
 | 
			
		||||
| Chrome Diagrammer        | [🎡🔗](https://chrome.google.com/webstore/detail/chrome-diagrammer/bkpbgjmkomfoakfklcjeoegkklgjnnpk)         | -                                                                              | -                                                                              | -                                                                                                                            | -                                                                                                    |
 | 
			
		||||
| Mermaid Diagrams         | [🎡🔗](https://chrome.google.com/webstore/detail/mermaid-diagrams/phfcghedmopjadpojhmmaffjmfiakfil)          | -                                                                              | -                                                                              | -                                                                                                                            | -                                                                                                    |
 | 
			
		||||
| Monkeys                  | [🎡🔗](https://chrome.google.com/webstore/detail/monkeys-mermaid-for-githu/cplfdpoajbclbgphaphphcldamfkjlgi) | -                                                                              | -                                                                              | -                                                                                                                            | -                                                                                                    |
 | 
			
		||||
| Mermaid Previewer        | [🎡🔗](https://chrome.google.com/webstore/detail/mermaid-previewer/oidjnlhbegipkcklbdfnbkikplpghfdl)         | -                                                                              | -                                                                              | -                                                                                                                            | -                                                                                                    |
 | 
			
		||||
| Name                     | Chrome Web Store                                                                                            | Firefox Add-ons                                                                | Opera                                                                          | Edge                                                                                                                         | Source/Repository                                                                                    |
 | 
			
		||||
| ------------------------ | ----------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------ | ------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------- |
 | 
			
		||||
| GitHub + Mermaid         | -                                                                                                           | [🦊🔗](https://addons.mozilla.org/firefox/addon/github-mermaid/)               | -                                                                              | -                                                                                                                            | [🐙🔗](https://github.com/BackMarket/github-mermaid-extension)                                       |
 | 
			
		||||
| Asciidoctor Live Preview | [🎡🔗](https://chromewebstore.google.com/detail/asciidoctorjs-live-previe/iaalpfgpbocpdfblpnhhgllgbdbchmia) | -                                                                              | -                                                                              | [🌀🔗](https://microsoftedge.microsoft.com/addons/detail/asciidoctorjs-live-previ/pefkelkanablhjdekgdahplkccnbdggd?hl=en-US) | -                                                                                                    |
 | 
			
		||||
| Diagram Tab              | -                                                                                                           | -                                                                              | -                                                                              | -                                                                                                                            | [🐙🔗](https://github.com/khafast/diagramtab)                                                        |
 | 
			
		||||
| Markdown Diagrams        | [🎡🔗](https://chromewebstore.google.com/detail/markdown-diagrams/pmoglnmodacnbbofbgcagndelmgaclel/)        | [🦊🔗](https://addons.mozilla.org/en-US/firefox/addon/markdown-diagrams/)      | [🔴🔗](https://addons.opera.com/en/extensions/details/markdown-diagrams/)      | [🌀🔗](https://microsoftedge.microsoft.com/addons/detail/markdown-diagrams/hceenoomhhdkjjijnmlclkpenkapfihe)                 | [🐙🔗](https://github.com/marcozaccari/markdown-diagrams-browser-extension/tree/master/doc/examples) |
 | 
			
		||||
| Markdown Viewer          | -                                                                                                           | [🦊🔗](https://addons.mozilla.org/en-US/firefox/addon/markdown-viewer-chrome/) | -                                                                              | -                                                                                                                            | [🐙🔗](https://github.com/simov/markdown-viewer)                                                     |
 | 
			
		||||
| Extensions for Mermaid   | -                                                                                                           | -                                                                              | [🔴🔗](https://addons.opera.com/en/extensions/details/extensions-for-mermaid/) | -                                                                                                                            | [🐙🔗](https://github.com/Stefan-S/mermaid-extension)                                                |
 | 
			
		||||
| Chrome Diagrammer        | [🎡🔗](https://chromewebstore.google.com/detail/chrome-diagrammer/bkpbgjmkomfoakfklcjeoegkklgjnnpk)         | -                                                                              | -                                                                              | -                                                                                                                            | -                                                                                                    |
 | 
			
		||||
| Mermaid Diagrams         | [🎡🔗](https://chromewebstore.google.com/detail/mermaid-diagrams/phfcghedmopjadpojhmmaffjmfiakfil)          | -                                                                              | -                                                                              | -                                                                                                                            | -                                                                                                    |
 | 
			
		||||
| Monkeys                  | [🎡🔗](https://chromewebstore.google.com/detail/monkeys-mermaid-for-githu/cplfdpoajbclbgphaphphcldamfkjlgi) | -                                                                              | -                                                                              | -                                                                                                                            | -                                                                                                    |
 | 
			
		||||
| Mermaid Previewer        | [🎡🔗](https://chromewebstore.google.com/detail/mermaid-previewer/oidjnlhbegipkcklbdfnbkikplpghfdl)         | -                                                                              | -                                                                              | -                                                                                                                            | -                                                                                                    |
 | 
			
		||||
 | 
			
		||||
### Other
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -419,6 +419,7 @@ In Mermaid, you have the option to configure the gitgraph diagram. You can confi
 | 
			
		||||
- `showCommitLabel` : Boolean, default is `true`. If set to `false`, the commit labels are not shown in the diagram.
 | 
			
		||||
- `mainBranchName` : String, default is `main`. The name of the default/root branch.
 | 
			
		||||
- `mainBranchOrder` : Position of the main branch in the list of branches. default is `0`, meaning, by default `main` branch is the first in the order.
 | 
			
		||||
- `parallelCommits`: Boolean, default is `false`. If set to `true`, commits x distance away from the parent are shown at the same level in the diagram.
 | 
			
		||||
 | 
			
		||||
Let's look at them one by one.
 | 
			
		||||
 | 
			
		||||
@@ -915,6 +916,78 @@ Usage example:
 | 
			
		||||
       commit
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
## Parallel commits (v10.8.0+)
 | 
			
		||||
 | 
			
		||||
Commits in Mermaid display temporal information in gitgraph by default. For example if two commits are one commit away from its parent, the commit that was made earlier is rendered closer to its parent. You can turn this off by enabling the `parallelCommits` flag.
 | 
			
		||||
 | 
			
		||||
### Temporal Commits (default, `parallelCommits: false`)
 | 
			
		||||
 | 
			
		||||
```mermaid-example
 | 
			
		||||
---
 | 
			
		||||
config:
 | 
			
		||||
  gitGraph:
 | 
			
		||||
    parallelCommits: false
 | 
			
		||||
---
 | 
			
		||||
gitGraph:
 | 
			
		||||
  commit
 | 
			
		||||
  branch develop
 | 
			
		||||
  commit
 | 
			
		||||
  commit
 | 
			
		||||
  checkout main
 | 
			
		||||
  commit
 | 
			
		||||
  commit
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
```mermaid
 | 
			
		||||
---
 | 
			
		||||
config:
 | 
			
		||||
  gitGraph:
 | 
			
		||||
    parallelCommits: false
 | 
			
		||||
---
 | 
			
		||||
gitGraph:
 | 
			
		||||
  commit
 | 
			
		||||
  branch develop
 | 
			
		||||
  commit
 | 
			
		||||
  commit
 | 
			
		||||
  checkout main
 | 
			
		||||
  commit
 | 
			
		||||
  commit
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
### Parallel commits (`parallelCommits: true`)
 | 
			
		||||
 | 
			
		||||
```mermaid-example
 | 
			
		||||
---
 | 
			
		||||
config:
 | 
			
		||||
  gitGraph:
 | 
			
		||||
    parallelCommits: true
 | 
			
		||||
---
 | 
			
		||||
gitGraph:
 | 
			
		||||
  commit
 | 
			
		||||
  branch develop
 | 
			
		||||
  commit
 | 
			
		||||
  commit
 | 
			
		||||
  checkout main
 | 
			
		||||
  commit
 | 
			
		||||
  commit
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
```mermaid
 | 
			
		||||
---
 | 
			
		||||
config:
 | 
			
		||||
  gitGraph:
 | 
			
		||||
    parallelCommits: true
 | 
			
		||||
---
 | 
			
		||||
gitGraph:
 | 
			
		||||
  commit
 | 
			
		||||
  branch develop
 | 
			
		||||
  commit
 | 
			
		||||
  commit
 | 
			
		||||
  checkout main
 | 
			
		||||
  commit
 | 
			
		||||
  commit
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
## Themes
 | 
			
		||||
 | 
			
		||||
Mermaid supports a bunch of pre-defined themes which you can use to find the right one for you. PS: you can actually override an existing theme's variable to get your own custom theme going. Learn more about theming your diagram [here](../config/theming.md).
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user