Git-kaavio
Git-kaavio on eri haaroissa tehtyjen git-commitien ja git-toimintojen visuaalinen esitys.
Git-kaaviosta on erityistä hyötyä kehittäjille ja ylläpitotiimeille, ja sitä voidaan käyttää heidän Git-haarastrategiansa jakamiseen.
Mermaid voi renderöidä Git-kaavion
Kopioi
Upotus
---
title: Example Git diagram
---
gitGraph
commit
commit
branch develop
checkout develop
commit
commit
checkout main
merge develop
commit
commit
Mermaid tukee perus git-toimintoja, kuten:
- commit : edustaa uutta committia nykyisessä haarassa.
- branch : luo ja vaihtaa uuteen haaraan ja asettaa sen nykyiseksi haaraksi.
- checkout : vaihtaa olemassa olevaan haaraan ja asettaa sen nykyiseksi haaraksi.
- merge : yhdistää olemassa olevan haaran nykyiseen haaraan.
Näiden Git-toimintojen avulla voit piirtää Git-kaavion Mermaidissa hyvin helposti ja nopeasti. Entiteettien nimet alkavat yleensä isolla kirjaimella, vaikka tälle ei ole yleisesti hyväksyttyä standardia eikä se ole Mermaidissa pakollista.
Huomautus: checkout ja switch ovat keskenään vaihdettavissa.
Syntaksi
Git-kaavion Mermaid-syntaksi on hyvin suoraviivainen ja yksinkertainen. Se käyttää deklaratiivista lähestymistapaa, ja jokainen commit piirretään Git-kaavion aikajanalle siinä järjestyksessä kuin se esiintyy koodissa. Pohjimmiltaan se noudattaa kunkin komennon lisäysjärjestystä.
Aloita määrittelemällä kaaviotyyppi gitGraph-syntaksilla. gitGraph-syntaksi kertoo Mermaidille, että haluat piirtää Git-kaavion, ja jäsentää kaaviokoodin sen mukaisesti.
Jokainen Git-kaavio alustetaan main-haaralla. Ellet luo eri haaroja, commitit menevät oletuksena päähaaraan. Tämä johtuu git:n toimintatavasta: alussa aloitat aina päähaarasta. Oletuksena main-haara asetetaan nykyiseksi haaraksi.
Voit rekisteröidä commitin nykyiseen haaraan commit-syntaksilla; katsotaan, miten tämä toimii:
Yksinkertainen git-kaavio, joka näyttää oletushaaran main kolme committia:
Kopioi
Upotus
gitGraph
commit
commit
commit
Jos tarkastelet tarkasti edellistä esimerkkiä, näet oletushaaran main sekä kolme committia. Huomaa myös, että oletuksena jokaiselle commitille annetaan ainutlaatuinen ja satunnainen ID.
Lisää mukautettu commit-tunniste
Tietylle commitille voit määrittää mukautetun tunnisteen id-ominaisuudella määrittelyn yhteydessä, lisätä sitten kaksoispisteen : ja merkitä mukautetun arvon lainausmerkkeihin.
Katsotaan alla olevan kuvan avulla, miten se toimii:
Kopioi
Upotus
gitGraph
commit id: "Alpha"
commit id: "Beta"
commit id: "Gamma"
在此示例中，我们给提交分配了自定义 ID。
Muuta commit-tyyppiä
Mermaidissa committeja on kolmea tyyppiä, ja ne renderöidään kaaviossa hieman eri tavoin. Nämä tyypit ovat:
- NORMAL : oletuscommit-tyyppi, esitetään täytetyllä ympyrällä
- REVERSE : korostaa, että commit on käänteinen commit, esitetään ristillä merkityllä täytetyllä ympyrällä.
- HIGHLIGHT : korostaa tiettyä committia, esitetään täytetyllä suorakaiteella.
Tietylle commitille voit määrittää sen tyypin type-ominaisuudella määrittelyn yhteydessä ja lisätä sitten kaksoispisteen : ja yllä käsitellyn halutun tyyppivaihtoehdon. Esimerkiksi: commit type:
Huomautus: jos commit-tyyppiä ei ole määritetty, oletuksena valitaan NORMAL
Katsotaan alla olevan kuvan avulla, miten nämä eri tyyppiset commitit toimivat:
Kopioi
Upotus
gitGraph
commit id: "Normal"
commit
commit id: "Reverse" type: REVERSE
commit
commit id: "Highlight" type: HIGHLIGHT
commit
Tässä esimerkissä määritimme kullekin commitille eri tyypin. Katso myös, miten sisällytimme sekä id:n että typen commitin määrittelyn yhteydessä.
Lisää merkintä
Tietylle commitille voit koristella sen tag-merkinnällä, samaan tapaan kuin git-maailman tag tai julkaisuversio. Voit liittää mukautetun merkinnän commitin määrittelyn yhteydessä tag-ominaisuudella, jota seuraa kaksoispiste :, ja merkitä mukautetun arvon lainausmerkkeihin.
Kopioi
Upotus
gitGraph
commit
commit id: "Normal" tag: "v1.0.0"
commit
commit id: "Reverse" type: REVERSE tag: "RC_1"
commit
commit id: "Highlight" type: HIGHLIGHT tag: "8.8.4"
commit
Tässä esimerkissä asetimme commitille mukautetun merkinnän.
Luo uusi haara
Luodaksesi uuden haaran Mermaidissa voit käyttää branch-syntaksia. Sinun on myös annettava uuden haaran nimi. Nimen on oltava ainutlaatuinen, eikä se voi olla olemassa olevan haaran nimi.
Kun Mermaid lukee branch-syntaksin, se luo uuden haaran ja asettaa sen nykyiseksi haaraksi. Tämä vastaa uuden haaran luomista ja siihen vaihtamista Git-kaaviossa.
Kopioi
Upotus
gitGraph
commit
commit
branch develop
commit
commit
commit
Tässä esimerkissä näkyy, miten aloitimme oletushaarasta main ja työnsimme siihen kaksi committia. Sitten loimme develop-haaran, ja kaikki sen jälkeiset commitit sijoitettiin develop-haaraan, koska siitä tuli nykyinen haara.
Vaihda olemassa olevaan haaraan
Vaihtaaksesi olemassa olevaan haaraan Mermaidissa voit käyttää checkout-syntaksia, ja sinun on myös annettava olemassa olevan haaran nimi. Jos määritetyn nimistä haaraa ei löydy, konsoliin tulee virhe. Käyttöesimerkki: checkout develop
Kun Mermaid lukee checkout-syntaksin, se löytää määritetyn nimisen haaran ja asettaa sen nykyiseksi haaraksi. Tämä vastaa haaran checkouausta Gitissä.
Kopioi
Upotus
gitGraph
commit
commit
branch develop
commit
commit
commit
checkout main
commit
commit
Tässä esimerkissä aloitimme ensin oletushaarasta main ja työnsimme siihen kaksi committia. Sitten loimme develop-haaran, minkä jälkeen kaikki kolme committia sijoitettiin develop-haaraan, koska siitä tuli nykyinen haara. Sen jälkeen asetimme checkout-syntaksilla nykyiseksi haaraksi mainin, ja kaikki sitä seuraavat commitit kirjataan main-haaraan.
Yhdistä kaksi haaraa
Yhdistääksesi olemassa olevaan haaraan tai liittyäksesi siihen Mermaidissa sinun on käytettävä merge-syntaksia. Sinun on myös annettava yhdistettävän olemassa olevan haaran nimi. Jos määritetyn nimistä haaraa ei löydy, konsoliin tulee virhe. Lisäksi voit yhdistää vain kaksi erillistä haaraa etkä voi yhdistää haaraa itseensä.
Syntaksiesimerkki: merge develop
Kun Mermaid lukee merge-syntaksin, se löytää määritetyn haaran ja sen viimeisen commitin ja yhdistää sen nykyisen haaran viimeiseen committiin. Se esitetään täytetyllä kaksoisympyrällä.
Seuraavassa on esimerkki kahden haaran yhdistämisestä:
Kopioi
Upotus
gitGraph
commit
commit
branch develop
commit
commit
commit
checkout main
commit
commit
merge develop
commit
commit
Tässä esimerkissä aloitettiin ensin main-haarasta ja työnnettiin siihen kaksi committia. Sitten loimme develop-haaran ja työnsimme develop-haaraan kolme committia. Sen jälkeen asetimme checkout-syntaksilla nykyiseksi haaraksi mainin, ja kaikki sitä seuraavat commitit tehtiin main-haaraan. Lopuksi yhdistimme develop-haaran main-haaraan, jolloin syntyi yhdistämiscommit. Koska nykyinen haara on tässä vaiheessa edelleen main, kaksi viimeistä committia kirjataan kyseiseen haaraan.
Voit myös lisätä vastaavia ominaisuuksia yhdistämiseesi:
- id korvaa oletus-ID:n mukautetulla ID:llä
- tag lisää mukautetun merkinnän yhdistämiscommittiin
- type korvaa yhdistämiscommitin oletustyypin. Voit käyttää muita aiemmin mainittuja commit-tyyppejä.
Kopioi
Upotus
gitGraph
commit id: "1"
commit id: "2"
branch nice_feature
checkout nice_feature
commit id: "3"
checkout main
commit id: "4"
checkout nice_feature
branch very_nice_feature
checkout very_nice_feature
commit id: "5"
checkout main
commit id: "6"
checkout nice_feature
commit id: "7"
checkout main
merge nice_feature id: "customID" tag: "customTag" type: REVERSE
checkout very_nice_feature
commit id: "8"
checkout main
commit id: "9"
Yhdistä valikoiden committeja toisesta haarasta
Mermaid tukee yhden commitin poimimista toisesta haarasta nykyiseen haaraan. Voit myös käyttää cherry-pick-syntaksia commitin poimimiseen toisesta haarasta.
Käyttääksesi cherry-pick-syntaksia sinun on määritettävä id id-ominaisuudella ja kirjoitettava sitten kaksoispisteen : jälkeen haluamasi commit-id ja suljettava se lainausmerkkeihin. Esimerkiksi:
Tässä on joitakin tärkeitä sääntöjä, jotka on otettava huomioon:
- Sinun on annettava id, jotta voit valita olemassa olevan commitin. Jos annettua commit-tunnistetta ei ole olemassa, syntyy virhe. Käytä tätä varten muotoa commit id:$value commitin määrittelyyn.
- Annettu commit ei saa olla nykyisessä haarassa, ja poimitun commitin on aina tultava nykyisestä haarasta poikkeavasta haarasta.
- Nykyisessä haarassa on oltava vähintään yksi commit ennen cherry-pickiä, muuten syntyy virhe.
- Kun poimit yhdistämiscommitin, on annettava yläcommitin tunniste. Jos ylä-ominaisuus jätetään pois tai annetaan virheellinen yläcommitin tunniste, syntyy virhe.
- Annetun yläcommitin on oltava poimittavan yhdistämiscommitin välitön yläcommit.
Kopioi
Upotus
gitGraph
commit id: "ZERO"
branch develop
branch release
commit id:"A"
checkout main
commit id:"ONE"
checkout develop
commit id:"B"
checkout main
merge develop id:"MERGE"
commit id:"TWO"
checkout release
cherry-pick id:"MERGE" parent:"B"
commit id:"THREE"
checkout develop
commit id:"C"
Tietyt kokoonpanovaihtoehdot
Mermaid Git-kaaviossa voit määrittää seuraavat vaihtoehdot:
- showBranches : totuusarvo, oletus true. Jos arvoksi asetetaan false, haaroja ei näytetä.
- showCommitLabel : totuusarvo, oletus true. Jos arvoksi asetetaan false, commit-merkintöjä ei näytetä.
- mainBranchName : merkkijono, oletus main. Oletushaaran nimi.
- mainBranchOrder : päähaaran sijainti haaraluettelossa. Oletus on 0, mikä tarkoittaa, että oletuksena main-haara on ensimmäisellä sijalla.
- parallelCommits : totuusarvo, oletus false. Jos arvoksi asetetaan true, ylätasosta erillään olevat commitit näytetään samalla tasolla.
Piilota haaran nimi ja yhdistävä viiva
Joskus saatat haluta piilottaa haaran nimen ja yhdistävän viivan. Voit tehdä tämän showBranches-syntaksilla. Oletuksena sen arvo on true, ja voit asettaa sen arvoon false komennolla.
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'base'
gitGraph:
showBranches: false
---
gitGraph
commit
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash" tag:"abc"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout main
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout main
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout main
commit
checkout release
merge main
checkout develop
merge release
Commit-merkinnän asettelu: kierto tai vaakasuora
Mermaid tukee kahta commit-merkinnän asettelutyyppiä. Oletusasettelu on kierretty, mikä tarkoittaa, että merkintä sijoitetaan commit-ympyrän alapuolelle ja kierretään 45 astetta paremman luettavuuden saavuttamiseksi. Tämä on erityisen hyödyllistä commiteille, joissa on pitkät merkinnät.
Toinen tyyppi on vaakasuora, mikä tarkoittaa, että merkintä sijoitetaan commit-ympyrän alapuolelle ja näytetään vaakasuunnassa keskellä ilman kiertoa. Tämä on erityisen hyödyllistä commiteille, joissa on lyhyet merkinnät.
Voit muuttaa commit-merkinnän asettelua käyttämällä komennossa rotateCommitLabel-syntaksia. Se on oletuksena true, mikä tarkoittaa, että commit-merkintä kiertyy.
Käyttöesimerkki: kierretyt commit-merkinnät
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'base'
gitGraph:
rotateCommitLabel: true
---
gitGraph
commit id: "feat(api): ..."
commit id: "a"
commit id: "b"
commit id: "fix(client): .extra long label.."
branch c2
commit id: "feat(modules): ..."
commit id: "test(client): ..."
checkout main
commit id: "fix(api): ..."
commit id: "ci: ..."
branch b1
commit
branch b2
commit
Käyttöesimerkki: vaakasuorat commit-merkinnät
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'base'
gitGraph:
rotateCommitLabel: false
---
gitGraph
commit id: "feat(api): ..."
commit id: "a"
commit id: "b"
commit id: "fix(client): .extra long label.."
branch c2
commit id: "feat(modules): ..."
commit id: "test(client): ..."
checkout main
commit id: "fix(api): ..."
commit id: "ci: ..."
branch b1
commit
branch b2
commit
Piilota commit-merkinnät
Joskus saatat haluta piilottaa commit-merkinnät. Voit tehdä tämän showCommitLabel-syntaksilla. Oletuksena sen arvo on true, ja voit asettaa sen arvoon false komennolla.
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'base'
gitGraph:
showBranches: false
showCommitLabel: false
---
gitGraph
commit
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout main
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout main
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout main
commit
checkout release
merge main
checkout develop
merge release
Mukautettu päähaaran nimi
Joskus saatat haluta mukauttaa päähaaran nimen. Voit tehdä tämän mainBranchName-syntaksilla. Oletuksena sen arvo on main, ja voit asettaa sen miksi tahansa merkkijonoksi komennolla.
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'base'
gitGraph:
showBranches: true
showCommitLabel: true
mainBranchName: 'MetroLine1'
---
gitGraph
commit id:"NewYork"
commit id:"Dallas"
branch MetroLine2
commit id:"LosAngeles"
commit id:"Chicago"
commit id:"Houston"
branch MetroLine3
commit id:"Phoenix"
commit type: HIGHLIGHT id:"Denver"
commit id:"Boston"
checkout MetroLine1
commit id:"Atlanta"
merge MetroLine3
commit id:"Miami"
commit id:"Washington"
merge MetroLine2 tag:"MY JUNCTION"
commit id:"Boston"
commit id:"Detroit"
commit type:REVERSE id:"SanFrancisco"
Katso Mermaidilla luotua virtuaalista metroreittikaaviota. Tässä muutamme oletuspäähaaran nimeksi MetroLine1.
Mukautettu haarajärjestys
Mermaidissa haarat näytetään oletuksena siinä järjestyksessä, jossa ne on määritelty tai joissa ne esiintyvät kaaviokoodissa.
Joskus saatat haluta mukauttaa haarajärjestystä. Voit tehdä sen käyttämällä order-syntaksia haaran määrittelyn vieressä, ja voit asettaa sen positiiviseksi luvuksi.
Mermaid noudattaa order-syntaksin antamaa prioriteettijärjestystä.
- Päähaara näytetään aina ensin, koska sen oletusjärjestysarvo on 0. (Ellei sen järjestystä ole muutettu kokoonpanon mainBranchOrder-syntaksilla ja muutettu arvosta 0)
- Seuraavaksi kaikki haarat, joilla ei ole order-arvoa, näytetään siinä järjestyksessä, jossa ne esiintyvät kaaviokoodissa.
- Seuraavaksi kaikki haarat, joilla on order-arvo, näytetään niiden order-arvon mukaisessa järjestyksessä.
Hallitaksesi kaikkien haarojen järjestystä täysin sinun on määritettävä order kaikille haaroille.
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'base'
gitGraph:
showBranches: true
showCommitLabel: true
---
gitGraph
commit
branch test1 order: 3
branch test2 order: 2
branch test3 order: 1
Yllä olevassa kuvassa kaikki haarat noudattavat määritettyä järjestystä.
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'base'
gitGraph:
showBranches: true
showCommitLabel: true
mainBranchOrder: 2
---
gitGraph
commit
branch test1 order: 3
branch test2
branch test3
branch test4 order: 1
Yllä olevassa kuvassa kaikki haarat, joille ei ole määritetty järjestystä, on piirretty määritetyssä järjestyksessä. Sen jälkeen test4-haara piirrettiin, koska sen järjestys on 1. Seuraavaksi main-haara piirrettiin, koska sen järjestys on 2. Lopuksi test1-haara piirrettiin, koska sen järjestys on 3.
Huomautus: koska olemme ohittaneet mainBranchOrder-arvon arvolla 2, main-haaraa ei piirretä alussa, vaan se näytetään järjestyksessä.
Tässä muutamme oletuspäähaaran nimeksi MetroLine1.
Suunta
Mermaid tukee kolmea suuntaa: vasemmalta oikealle (oletus), ylhäältä alas ja alhaalta ylös.
Vasemmalta oikealle (oletus, LR:)
Mermaidissa oletussuunta kulkee vasemmalta oikealle, ja haarat on pinottu toistensa päälle.
Voit kuitenkin asettaa tämän eksplisiittisesti käyttämällä LR: gitGraph-syntaksin jälkeen.
Kopioi
Upotus
gitGraph LR:
commit
commit
branch develop
commit
commit
checkout main
commit
commit
merge develop
commit
commit
Ylhäältä alas (TB:)
Ylhäältä alas -suunnassa commitit kulkevat kaavion yläosasta alaosaan ja haarat on järjestetty vierekkäin.
Suunnataksesi kaavion tällä tavalla sinun on lisättävä TB: gitGraph-syntaksin jälkeen.
Kopioi
Upotus
gitGraph TB:
commit
commit
branch develop
commit
commit
checkout main
commit
commit
merge develop
commit
commit
Alhaalta ylös (BT:)
Alhaalta ylös -suunnassa commitit kulkevat kaavion alaosasta yläosaan ja haarat on järjestetty vierekkäin.
Suunnataksesi kaavion tällä tavalla sinun on lisättävä BT: gitGraph-syntaksin jälkeen.
Kopioi
Upotus
gitGraph BT:
commit
commit
branch develop
commit
commit
checkout main
commit
commit
merge develop
commit
commit
Väliaikaiset commitit (parallelCommits: false)
Kopioi
Upotus
---
config:
gitGraph:
parallelCommits: false
---
gitGraph:
commit
branch develop
commit
commit
checkout main
commit
commit
Rinnakkaiset commitit (parallelCommits: true)
Kopioi
Upotus
---
config:
gitGraph:
parallelCommits: true
---
gitGraph:
commit
branch develop
commit
commit
checkout main
commit
commit
Teema
Mermaid tukee useita mukautettuja teemoja, joita voit käyttää itsellesi sopivan teeman löytämiseen. Huomautus: voit itse asiassa ohittaa olemassa olevan teeman muuttujat luodaksesi oman mukautetun teemasi.
Seuraavassa on eri mukautetut teemavaihtoehdot:
- redux-color
- redux-dark-color
- redux
- redux-dark
- default
- neutral
- dark
- forest
- neo
- neo-dark
- base
Teeman muuttamiseksi voit käyttää initialize-syntaksia.
Perusteema
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'base'
---
gitGraph
commit
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash" tag:"abc"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout main
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout main
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout main
commit
checkout release
merge main
checkout develop
merge release
Metsäteema
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'forest'
---
gitGraph
commit
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash" tag:"abc"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout main
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout main
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout main
commit
checkout release
merge main
checkout develop
merge release
Oletusteema
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'default'
---
gitGraph
commit type:HIGHLIGHT
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash" tag:"abc"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout main
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout main
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout main
commit
checkout release
merge main
checkout develop
merge release
Tumma teema
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'dark'
---
gitGraph
commit
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash" tag:"abc"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout main
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout main
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout main
commit
checkout release
merge main
checkout develop
merge release
Neutraali teema
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'neutral'
---
gitGraph
commit
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash" tag:"abc"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout main
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout main
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout main
commit
checkout release
merge main
checkout develop
merge release
Mukautus teemamuuttujilla
Mermaid sallii kaavion mukauttamisen teemamuuttujilla, jotka ohjaavat kaavion eri elementtien ulkoasua ja tyyliä.
Ymmärtämisen helpottamiseksi käytämme esimerkkinä teemaa default; teemamuuttujien oletusarvot valitaan automaattisesti teemasta.
Haaran värin asettaminen default-teemalla:
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'default'
---
gitGraph
commit
branch develop
commit tag:"v1.0.0"
commit
checkout main
commit type: HIGHLIGHT
commit
merge develop
commit
branch featureA
commit
Mermaid tukee teemamuuttujia oletusarvojen ohittamiseen, enintään 8 haaran osalta, eli voit asettaa teemamuuttujilla enintään 8 haaran värin. Kun haaroja on yli 8, teemamuuttujia käytetään uudelleen kiertävällä tavalla, eli 9. haara käyttää 1. haaran tyyliä.
Mukautettu haaran väri
Voit mukauttaa haaran väriä teemamuuttujilla git0–git7. Mermaid sallii enintään 8 haaran värin asettamisen, jossa git0-muuttuja määrittää ensimmäisen haaran värin, git1 toisen haaran värin ja niin edelleen.
Huomautus: näiden teemamuuttujien oletusarvot on otettu valitusta teemasta. Jos haluat ohittaa oletusarvot, voit lisätä mukautettuja teemamuuttujien arvoja initialize-syntaksilla.
Esimerkki:
Ohitetaan nyt muuttujien git0–git3 oletusarvot:
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'default'
themeVariables:
'git0': '#ff0000'
'git1': '#00ff00'
'git2': '#0000ff'
'git3': '#ff00ff'
'git4': '#00ffff'
'git5': '#ffff00'
'git6': '#ff00ff'
'git7': '#00ffff'
---
gitGraph
commit
branch develop
commit tag:"v1.0.0"
commit
checkout main
commit type: HIGHLIGHT
commit
merge develop
commit
branch featureA
commit
Mukautettu haaran merkinnän väri
Voit mukauttaa haaran merkinnän väriä teemamuuttujilla gitBranchLabel0–gitBranchLabel7. Mermaid sallii enintään 8 haaran värin asettamisen, jossa gitBranchLabel0-muuttuja määrittää ensimmäisen haaran merkinnän värin, gitBranchLabel1-muuttuja toisen haaran merkinnän värin ja niin edelleen.
Katsotaan, miten haaran merkinnän väri asetetaan default-teemalla:
Ohitetaan nyt muuttujien gitBranchLabel0–gitBranchLabel2 oletusarvot:
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'default'
themeVariables:
'gitBranchLabel0': '#ffffff'
'gitBranchLabel1': '#ffffff'
'gitBranchLabel2': '#ffffff'
'gitBranchLabel3': '#ffffff'
'gitBranchLabel4': '#ffffff'
'gitBranchLabel5': '#ffffff'
'gitBranchLabel6': '#ffffff'
'gitBranchLabel7': '#ffffff'
'gitBranchLabel8': '#ffffff'
'gitBranchLabel9': '#ffffff'
---
gitGraph
checkout main
branch branch1
branch branch2
branch branch3
branch branch4
branch branch5
branch branch6
branch branch7
branch branch8
branch branch9
checkout branch1
commit
Tässä näet, että branch8:n ja branch9:n värit ja tyylit on otettu haaroista, joiden indeksisijainti on 0 (main) ja 1 (branch1).
Mukautettu commit-väri
Voit mukauttaa commit-merkinnän värin ja taustavärin erikseen teemamuuttujilla commitLabelColor ja commitLabelBackground.
Esimerkki: ohitetaan nyt muuttujien commitLabelColor–commitLabelBackground oletusarvot:
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'default'
themeVariables:
commitLabelColor: '#ff0000'
commitLabelBackground: '#00ff00'
---
gitGraph
commit
branch develop
commit tag:"v1.0.0"
commit
checkout main
commit type: HIGHLIGHT
commit
merge develop
commit
branch featureA
commit
mermaid.grammar_mermaid_commit_label_define_label_font_big_small
Voit mukauttaa commit-merkinnän fonttikokoa teemamuuttujalla commitLabelFontSize.
Esimerkki: ohitetaan nyt muuttujan commitLabelFontSize oletusarvo:
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'default'
themeVariables:
commitLabelColor: '#ff0000'
commitLabelBackground: '#00ff00'
commitLabelFontSize: '16px'
---
gitGraph
commit
branch develop
commit tag:"v1.0.0"
commit
checkout main
commit type: HIGHLIGHT
commit
merge develop
commit
branch featureA
commit
Mukautettu merkinnän fonttikoko
Voit mukauttaa merkinnän fonttikokoa teemamuuttujalla tagLabelFontSize.
Esimerkki: ohitetaan nyt muuttujan tagLabelFontSize oletusarvo:
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'default'
themeVariables:
commitLabelColor: '#ff0000'
commitLabelBackground: '#00ff00'
tagLabelFontSize: '16px'
---
gitGraph
commit
branch develop
commit tag:"v1.0.0"
commit
checkout main
commit type: HIGHLIGHT
commit
merge develop
commit
branch featureA
commit
Mukautettu merkinnän väri
Voit mukauttaa merkintää teemamuuttujilla tagLabelColor, tagLabelBackground ja tagLabelBorder, jotka muuttavat vastaavasti merkinnän tekstin väriä, merkinnän taustaväriä ja merkinnän reunusta.
Esimerkki: ohitetaan nyt muuttujien tagLabelColor, tagLabelBackground ja tagLabelBorder oletusarvot:
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'default'
themeVariables:
tagLabelColor: '#ff0000'
tagLabelBackground: '#00ff00'
tagLabelBorder: '#0000ff'
---
gitGraph
commit
branch develop
commit tag:"v1.0.0"
commit
checkout main
commit type: HIGHLIGHT
commit
merge develop
commit
branch featureA
commit
Mukautettu korostetun commitin väri
Voit mukauttaa korostetun commitin väriä sen haaran mukaan teemamuuttujilla gitInv0–gitInv7. Mermaid sallii tietyn korostetun commitin värin asettamisen enintään 8 haaralle, jossa gitInv0-muuttuja määrittää ensimmäisen haaran korostetun commitin värin, gitInv1-muuttuja toisen haaran korostetun commitin värin ja niin edelleen.
Ohitetaan nyt muuttujien git0–git3 oletusarvot:
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'default'
themeVariables:
'gitInv0': '#ff0000'
---
gitGraph
commit
branch develop
commit tag:"v1.0.0"
commit
checkout main
commit type: HIGHLIGHT
commit
merge develop
commit
branch featureA
commit
