diff --git a/docs/syntax/gitgraph.md b/docs/syntax/gitgraph.md index f2609e31c5..8d39ddbcbd 100644 --- a/docs/syntax/gitgraph.md +++ b/docs/syntax/gitgraph.md @@ -827,18 +827,25 @@ Here, we have changed the default main branch name to `MetroLine1`. ## Orientation (v10.3.0+) -In Mermaid, the default orientation is Left to Right. The branches are lined vertically. +Mermaid supports two graph orientations: **Left-to-Right** (default) and **Top-to-Bottom**. + +You can set this with either `LR:` (for [**Left-to-Right**](#left-to-right-default-lr)) or `TB:` (for [**Top-to-Bottom**](#top-to-bottom-tb)) after `gitGraph`. + +### Left to Right (default, `LR:`) + +In Mermaid, the default orientation is for commits to run from left to right and for branches to be stacked on top of one another. + +However, you can set this explicitly with `LR:` after `gitGraph`. Usage example: ```mermaid-example - gitGraph + gitGraph LR: commit commit branch develop commit commit - commit checkout main commit commit @@ -848,13 +855,12 @@ Usage example: ``` ```mermaid - gitGraph + gitGraph LR: commit commit branch develop commit commit - commit checkout main commit commit @@ -863,9 +869,11 @@ Usage example: commit ``` -Sometimes we may want to change the orientation. Currently, Mermaid supports two orientations: **Left to Right**(default) and **Top to Bottom**. +### Top to Bottom (`TB:`) + +In `TB` (**Top-to-Bottom**) orientation, the commits run from top to bottom of the graph and branches are arranged side-by-side. -In order to change the orientation from top to bottom i.e. branches lined horizontally, you need to add `TB` along with `gitGraph`. +To orient the graph this way, you need to add `TB:` after gitGraph. Usage example: @@ -876,7 +884,6 @@ Usage example: branch develop commit commit - commit checkout main commit commit @@ -892,7 +899,6 @@ Usage example: branch develop commit commit - commit checkout main commit commit diff --git a/packages/mermaid/src/docs/syntax/gitgraph.md b/packages/mermaid/src/docs/syntax/gitgraph.md index 87f43afdde..5fa09cb225 100644 --- a/packages/mermaid/src/docs/syntax/gitgraph.md +++ b/packages/mermaid/src/docs/syntax/gitgraph.md @@ -513,18 +513,25 @@ Here, we have changed the default main branch name to `MetroLine1`. ## Orientation (v10.3.0+) -In Mermaid, the default orientation is Left to Right. The branches are lined vertically. +Mermaid supports two graph orientations: **Left-to-Right** (default) and **Top-to-Bottom**. + +You can set this with either `LR:` (for [**Left-to-Right**](#left-to-right-default-lr)) or `TB:` (for [**Top-to-Bottom**](#top-to-bottom-tb)) after `gitGraph`. + +### Left to Right (default, `LR:`) + +In Mermaid, the default orientation is for commits to run from left to right and for branches to be stacked on top of one another. + +However, you can set this explicitly with `LR:` after `gitGraph`. Usage example: ```mermaid-example - gitGraph + gitGraph LR: commit commit branch develop commit commit - commit checkout main commit commit @@ -533,9 +540,11 @@ Usage example: commit ``` -Sometimes we may want to change the orientation. Currently, Mermaid supports two orientations: **Left to Right**(default) and **Top to Bottom**. +### Top to Bottom (`TB:`) -In order to change the orientation from top to bottom i.e. branches lined horizontally, you need to add `TB` along with `gitGraph`. +In `TB` (**Top-to-Bottom**) orientation, the commits run from top to bottom of the graph and branches are arranged side-by-side. + +To orient the graph this way, you need to add `TB:` after gitGraph. Usage example: @@ -546,7 +555,6 @@ Usage example: branch develop commit commit - commit checkout main commit commit