GitHub/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-01-28 07:03:17 +08:00
Code Issues Projects Releases Wiki Activity

GitGraph: updated demo page to include top-to-bottom examples.

Browse Source
This commit is contained in:
Guy Pursey 2023-10-12 07:24:57 +01:00
parent 4787bb07df
commit 60bb7b5b6c
1 changed files with 98 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

110
demos/git.html
View File

@ -14,12 +14,13 @@
</head> </head>
<body> <body>
<h1>Git diagram demo</h1> <h1>Git graph demo</h1>
<h2>Simple "branch and merge" graph</h2>
<pre class="mermaid"> <pre class="mermaid">
--- ---
title: Simple "branch and merge" title: Simple "branch and merge" (left-to-right)
--- ---
gitGraph: gitGraph LR:
commit commit
branch newbranch branch newbranch
checkout newbranch checkout newbranch
@ -27,12 +28,24 @@
checkout main checkout main
merge newbranch merge newbranch
</pre> </pre>
<pre class="mermaid"> <pre class="mermaid">
--- ---
title: Continuous development title: Simple "branch and merge" (top-to-bottom)
--- ---
gitGraph: gitGraph TB:
commit
branch newbranch
checkout newbranch
commit
checkout main
merge newbranch
</pre>
<h2>Continuous development graph</h2>
<pre class="mermaid">
---
title: Continuous development (left-to-right)
---
gitGraph LR:
commit commit
branch develop branch develop
checkout develop checkout develop
@ -46,7 +59,24 @@
</pre> </pre>
<pre class="mermaid"> <pre class="mermaid">
--- ---
title: Two-way merges title: Continuous development (top-to-bottom)
---
gitGraph TB:
commit
branch develop
checkout develop
commit
checkout main
merge develop
checkout develop
commit
checkout main
merge develop
</pre>
<h2>Two-way merges</h2>
<pre class="mermaid">
---
title: Two-way merges (left-to-right)
--- ---
gitGraph: gitGraph:
commit commit
@ -64,9 +94,28 @@
</pre> </pre>
<pre class="mermaid"> <pre class="mermaid">
--- ---
title: Cherry-pick title: Two-way merges (top-to-bottom)
--- ---
gitGraph: gitGraph TB:
commit
branch develop
checkout develop
commit
checkout main
merge develop
commit
checkout develop
merge main
commit
checkout main
merge develop
</pre>
<h2>Simple "cherry-pick" graph</h2>
<pre class="mermaid">
---
title: Cherry-pick (left-to-right)
---
gitGraph LR:
commit commit
branch newbranch branch newbranch
checkout newbranch checkout newbranch
@ -81,9 +130,47 @@
</pre> </pre>
<pre class="mermaid"> <pre class="mermaid">
--- ---
title: Three branches title: Cherry-pick (top-to-bottom)
--- ---
gitGraph: gitGraph TB:
commit
branch newbranch
checkout newbranch
commit id: "Pick me"
checkout main
commit
checkout newbranch
commit
checkout main
cherry-pick id: "Pick me"
merge newbranch
</pre>
<h2>Three branches graph</h2>
<pre class="mermaid">
---
title: Three branches (left-to-right)
---
gitGraph LR:
commit
branch develop
checkout develop
commit
branch feature
checkout feature
commit
checkout main
merge feature id:"Direct to main"
checkout develop
merge feature
commit
checkout main
merge develop
</pre>
<pre class="mermaid">
---
title: Three branches (top-to-bottom)
---
gitGraph TB:
commit commit
branch develop branch develop
checkout develop checkout develop
@ -99,7 +186,6 @@
checkout main checkout main
merge develop merge develop
</pre> </pre>
<script type="module"> <script type="module">
import mermaid from './mermaid.esm.mjs'; import mermaid from './mermaid.esm.mjs';
const ALLOWED_TAGS = [ const ALLOWED_TAGS = [