diff --git a/packages/mermaid/src/docs/syntax/gitgraph.md b/packages/mermaid/src/docs/syntax/gitgraph.md index f1930bb27..a9b99e684 100644 --- a/packages/mermaid/src/docs/syntax/gitgraph.md +++ b/packages/mermaid/src/docs/syntax/gitgraph.md @@ -511,6 +511,50 @@ NOTE: Because we have overridden the `mainBranchOrder` to `2`, the `main` branch Here, we have changed the default main branch name to `MetroLine1`. +## Orientation + +In Mermaid, the default orientation is Left to Right. The branches are lined vertically. + +Usage example: + +```mermaid-example + gitGraph + commit + commit + branch develop + commit + commit + commit + checkout main + commit + commit + merge develop + commit + commit +``` + +Sometimes we may want to change the orientation. Currently, Mermaid supports two orientations: **Left to Right**(default) and **Top to Bottom**. + +In order to change the orientation from top to bottom i.e. branches lined horizontally, you need to add `TB` along with `gitGraph`. + +Usage example: + +```mermaid-example + gitGraph TB: + commit + commit + branch develop + commit + commit + commit + checkout main + commit + commit + merge develop + 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).