फ्लोचार्ट
ग्राफ़िकल अभिव्यक्ति
माइंड मैप
संरचित अभिव्यक्ति
नोट्स
कुशल अभिव्यक्ति

Git डायग्रामसिंटैक्स

Git डायग्राम

Git ग्राफ़ विभिन्न ब्रांचों पर git कमिट और git ऑपरेशनों की विज़ुअल अभिव्यक्ति है।

Git ग्राफ़ डेवलपर्स और ऑप्स टीमों के लिए विशेष रूप से सहायक होता है, जिसका उपयोग वे अपनी Git ब्रांच रणनीति साझा करने के लिए कर सकते हैं।

Mermaid Git ग्राफ़ रेंडर कर सकता है

कोड
                            
कॉपी करें
एम्बेड
--- title: Example Git diagram --- gitGraph commit commit branch develop checkout develop commit commit checkout main merge develop commit commit

Mermaid बुनियादी git ऑपरेशनों का समर्थन करता है, जैसे:

  • commit : वर्तमान ब्रांच पर एक नया कमिट दर्शाता है।
  • branch : नई ब्रांच बनाता है और उस पर स्विच करता है, साथ ही उसे वर्तमान ब्रांच बनाता है।
  • checkout : किसी मौजूदा ब्रांच पर स्विच करता है और उसे वर्तमान ब्रांच बनाता है।
  • merge : मौजूदा ब्रांच को वर्तमान ब्रांच में मर्ज करता है।

इन Git ऑपरेशनों की सहायता से, आप Mermaid में बहुत आसानी और तेज़ी से Git ग्राफ़ बना सकते हैं। एंटिटी नाम आमतौर पर बड़े अक्षरों से शुरू होते हैं, हालाँकि इसके लिए कोई मान्यता प्राप्त मानक नहीं है, और Mermaid में यह अनिवार्य भी नहीं है।

नोट: checkout और switch का उपयोग अंतर्बदल रूप से किया जा सकता है।

सिंटैक्स

Git ग्राफ़ की Mermaid सिंटैक्स बहुत सीधी और सरल है। यह घोषणात्मक दृष्टिकोण अपनाती है, प्रत्येक कमिट को कोड में उसके प्रकट होने के क्रम में Git ग्राफ़ की टाइमलाइन पर बनाया जाता है। मूल रूप से, यह प्रत्येक कमांड के सम्मिलन क्रम का पालन करती है।

सबसे पहले, अपने चार्ट प्रकार को घोषित करने के लिए gitGraph सिंटैक्स का उपयोग करें। gitGraph सिंटैक्स Mermaid को बताता है कि आप Git ग्राफ़ बनाना चाहते हैं, और तदनुसार चार्ट कोड को पार्स करता है।

प्रत्येक Git ग्राफ़ main ब्रांच से आरंभ होता है। जब तक आप कोई भिन्न ब्रांच नहीं बनाते, डिफ़ॉल्ट रूप से कमिट मुख्य ब्रांच में जाते हैं। यह git के कार्य करने के तरीके से प्रेरित है, शुरुआत में आप हमेशा मुख्य ब्रांच से ही शुरू करते हैं। डिफ़ॉल्ट रूप से, main ब्रांच को वर्तमान ब्रांच सेट किया जाता है।

आप वर्तमान ब्रांच पर एक कमिट दर्ज करने के लिए commit सिंटैक्स का उपयोग कर सकते हैं; आइए देखें कि यह कैसे काम करता है:

एक सरल git ग्राफ़, जो डिफ़ॉल्ट ब्रांच main के तीन कमिट दिखाता है:

कोड
                            
कॉपी करें
एम्बेड
gitGraph commit commit commit

यदि आप पिछले उदाहरण को ध्यान से देखें, तो आप डिफ़ॉल्ट ब्रांच main और तीन कमिट देख सकते हैं। यह भी ध्यान दें कि डिफ़ॉल्ट रूप से, प्रत्येक कमिट को एक अद्वितीय और यादृच्छिक ID दी जाती है।

कस्टम कमिट ID जोड़ें

किसी कमिट के लिए, आप घोषित करते समय id प्रॉपर्टी से कस्टम ID निर्दिष्ट कर सकते हैं, फिर कोलन : लगाएँ, और दोहरे उद्धरण चिह्नों के भीतर कस्टम मान लिखें।

आइए नीचे दिए गए चित्र की सहायता से देखें कि यह कैसे काम करता है:

कोड
                            
कॉपी करें
एम्बेड
gitGraph commit id: "Alpha" commit id: "Beta" commit id: "Gamma"

在此示例中,我们给提交分配了自定义 ID。

कमिट प्रकार बदलें

Mermaid में, कमिट तीन प्रकार के होते हैं, जो चार्ट में थोड़े भिन्न तरीके से रेंडर होते हैं। ये प्रकार हैं:

  • NORMAL : डिफ़ॉल्ट कमिट प्रकार, जिसे ठोस वृत्त से दर्शाया जाता है
  • REVERSE : यह बल देता है कि कमिट रिवर्स कमिट है, जिसे क्रॉस वाले ठोस वृत्त से दर्शाया जाता है।
  • HIGHLIGHT : विशिष्ट कमिट को हाइलाइट करता है, जिसे ठोस आयत से दर्शाया जाता है।

किसी दिए गए कमिट के लिए, आप घोषित करते समय type प्रॉपर्टी का उपयोग करके उसका प्रकार निर्दिष्ट कर सकते हैं, उसके बाद कोलन : और ऊपर चर्चा किया गया आवश्यक प्रकार विकल्प। उदाहरण: commit type:

नोट: यदि कमिट प्रकार निर्दिष्ट नहीं किया गया है, तो डिफ़ॉल्ट रूप से NORMAL चुना जाता है

आइए नीचे दिए गए चित्र के माध्यम से देखें कि ये भिन्न प्रकार के कमिट कैसे आगे बढ़ते हैं:

कोड
                            
कॉपी करें
एम्बेड
gitGraph commit id: "Normal" commit commit id: "Reverse" type: REVERSE commit commit id: "Highlight" type: HIGHLIGHT commit

इस उदाहरण में, हमने प्रत्येक कमिट के लिए भिन्न प्रकार निर्दिष्ट किया है। इसके अलावा, देखें कि कमिट घोषित करते समय हमने id और type दोनों को एक साथ कैसे शामिल किया है।

टैग जोड़ें

किसी दिए गए कमिट के लिए, आप उसे tag से सजा सकते हैं, जो git world में टैग या रिलीज़ संस्करण की अवधारणा के समान है। आप कमिट घोषित करते समय tag प्रॉपर्टी के साथ कस्टम टैग संलग्न कर सकते हैं, उसके बाद कोलन :, और दोहरे उद्धरण चिह्नों के भीतर कस्टम मान लिखें।

कोड
                            
कॉपी करें
एम्बेड
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

इस उदाहरण में, हमने कमिट के लिए कस्टम टैग सेट किया है।

नई ब्रांच बनाएँ

Mermaid में, नई ब्रांच बनाने के लिए, आप branch सिंटैक्स का उपयोग कर सकते हैं। आपको नई ब्रांच का नाम भी प्रदान करना होगा। नाम अद्वितीय होना चाहिए और मौजूदा ब्रांच का नाम नहीं हो सकता।

जब Mermaid branch सिंटैक्स पढ़ता है, तो यह एक नई ब्रांच बनाता है और उसे वर्तमान ब्रांच सेट करता है। यह Git ग्राफ़ में नई ब्रांच बनाकर उस पर स्विच करने के समान है।

कोड
                            
कॉपी करें
एम्बेड
gitGraph commit commit branch develop commit commit commit

इस उदाहरण में, आप देख सकते हैं कि हमने डिफ़ॉल्ट main ब्रांच से कैसे शुरू किया और उस पर दो कमिट पुश किए। फिर हमने develop ब्रांच बनाई, जिसके बाद के सभी कमिट develop ब्रांच पर रखे गए, क्योंकि यह वर्तमान ब्रांच बन गई।

मौजूदा ब्रांच चेकआउट करें

Mermaid में, मौजूदा ब्रांच पर स्विच करने के लिए, आप checkout सिंटैक्स का उपयोग कर सकते हैं, साथ ही आपको मौजूदा ब्रांच का नाम भी प्रदान करना होगा। यदि निर्दिष्ट नाम की ब्रांच नहीं मिलती, तो कंसोल त्रुटि होगी। उपयोग उदाहरण: checkout develop

जब Mermaid checkout सिंटैक्स पढ़ता है, तो यह निर्दिष्ट नाम की ब्रांच ढूँढता है और उसे वर्तमान ब्रांच सेट करता है। यह Git में किसी ब्रांच को चेकआउट करने के समान है।

कोड
                            
कॉपी करें
एम्बेड
gitGraph commit commit branch develop commit commit commit checkout main commit commit

इस उदाहरण में, हम पहले डिफ़ॉल्ट main ब्रांच से शुरू करते हैं और उस पर दो बार कमिट पुश करते हैं। फिर हमने develop ब्रांच बनाई, जिसके बाद सभी तीन कमिट develop ब्रांच पर रखे गए, क्योंकि यह वर्तमान ब्रांच बन गई। इसके बाद, हमने checkout सिंटैक्स का उपयोग करके वर्तमान ब्रांच को main सेट किया, और बाद के सभी कमिट main ब्रांच पर दर्ज हुए।

दो ब्रांच मर्ज करें

Mermaid में, किसी मौजूदा ब्रांच को मर्ज या कनेक्ट करने के लिए, आपको merge सिंटैक्स का उपयोग करना होगा। साथ ही, आपको मर्ज की जाने वाली मौजूदा ब्रांच का नाम भी प्रदान करना होगा। यदि निर्दिष्ट नाम की ब्रांच नहीं मिलती, तो कंसोल पर त्रुटि प्रदर्शित होगी। इसके अलावा, आप केवल दो स्वतंत्र ब्रांच को मर्ज कर सकते हैं, किसी ब्रांच को स्वयं के साथ मर्ज नहीं कर सकते।

सिंटैक्स उदाहरण: merge develop

जब Mermaid merge सिंटैक्स पढ़ता है, तो यह निर्दिष्ट ब्रांच और उसके अंतिम कमिट को ढूँढता है, और उसे वर्तमान ब्रांच के अंतिम कमिट के साथ मर्ज करता है। इसे ठोस दोहरे वृत्त से दर्शाया जाता है।

निम्नलिखित दो ब्रांच मर्ज करने का उदाहरण है:

कोड
                            
कॉपी करें
एम्बेड
gitGraph commit commit branch develop commit commit commit checkout main commit commit merge develop commit commit

इस उदाहरण में, पहले main ब्रांच से शुरू किया जाता है और उस पर दो कमिट पुश किए जाते हैं। फिर हमने develop ब्रांच बनाई और develop ब्रांच पर तीन कमिट पुश किए। इसके बाद, हमने checkout सिंटैक्स का उपयोग करके वर्तमान ब्रांच को main सेट किया, और बाद के सभी कमिट main ब्रांच के लिए किए गए। अंत में, हमने develop ब्रांच को main ब्रांच में मर्ज किया, जिससे एक मर्ज कमिट उत्पन्न हुआ। चूँकि इस समय वर्तमान ब्रांच अभी भी main है, अंतिम दो कमिट उसी ब्रांच पर दर्ज होंगे।

आप अपने मर्ज के लिए समान गुण भी जोड़ सकते हैं:

  • id कस्टम ID से डिफ़ॉल्ट ID को ओवरराइड करता है
  • tag मर्ज कमिट में कस्टम टैग जोड़ता है
  • type मर्ज कमिट के डिफ़ॉल्ट प्रकार को ओवरराइड करता है। आप पहले बताए गए अन्य कमिट प्रकारों का उपयोग कर सकते हैं।
कोड
                            
कॉपी करें
एम्बेड
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"

किसी अन्य ब्रांच से चुनिंदा रूप से कमिट मर्ज करें

Mermaid किसी कमिट को अन्य ब्रांच से वर्तमान ब्रांच में चुनने (cherry-pick) का समर्थन करता है। आप अन्य ब्रांच से कमिट चुनने के लिए cherry-pick सिंटैक्स भी उपयोग कर सकते हैं।

cherry-pick सिंटैक्स का उपयोग करने के लिए, आपको id प्रॉपर्टी से id निर्दिष्ट करना होगा, फिर कोलन : के बाद अपनी इच्छित कमिट id लिखें, और उसे दोहरे उद्धरण चिह्नों में लपेटें। उदाहरण:

यहाँ ध्यान देने योग्य कुछ महत्वपूर्ण नियम हैं:

  • मौजूदा कमिट चुनने के लिए आपको id प्रदान करना होगा। यदि दी गई कमिट ID मौजूद नहीं है, तो त्रुटि होगी। इसके लिए, कमिट घोषित करने के लिए commit id:$value फ़ॉर्मेट का उपयोग करें।
  • दी गई कमिट वर्तमान ब्रांच पर मौजूद नहीं होनी चाहिए, चुनी गई कमिट हमेशा वर्तमान ब्रांच से भिन्न ब्रांच की होनी चाहिए।
  • cherry-pick करने से पहले वर्तमान ब्रांच में कम से कम एक कमिट होना चाहिए, अन्यथा त्रुटि होगी।
  • मर्ज कमिट चुनते समय, पैरेंट कमिट ID प्रदान करना आवश्यक है। यदि पैरेंट प्रॉपर्टी छोड़ी जाए या अमान्य पैरेंट कमिट ID प्रदान की जाए, तो त्रुटि उत्पन्न होगी।
  • निर्दिष्ट पैरेंट कमिट उस मर्ज कमिट का सीधा पैरेंट होना चाहिए जिसे चुना जा रहा है।
कोड
                            
कॉपी करें
एम्बेड
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"

विशिष्ट कॉन्फ़िगरेशन विकल्प

Mermaid Git ग्राफ़ में आप निम्नलिखित विकल्प कॉन्फ़िगर कर सकते हैं:

  • showBranches : बूलियन मान, डिफ़ॉल्ट true। यदि false पर सेट किया जाए, तो ब्रांच प्रदर्शित नहीं होगी।
  • showCommitLabel : बूलियन मान, डिफ़ॉल्ट true। यदि false पर सेट किया जाए, तो कमिट लेबल प्रदर्शित नहीं होगा।
  • mainBranchName : स्ट्रिंग, डिफ़ॉल्ट main। डिफ़ॉल्ट ब्रांच का नाम।
  • mainBranchOrder : ब्रांच सूची में मुख्य ब्रांच की स्थिति। डिफ़ॉल्ट 0, जिसका अर्थ है कि डिफ़ॉल्ट रूप से main ब्रांच पहले स्थान पर होती है।
  • parallelCommits : बूलियन मान, डिफ़ॉल्ट false। यदि true पर सेट किया जाए, तो पैरेंट से दूर की कमिट समान स्तर पर प्रदर्शित होंगी।

ब्रांच नाम और कनेक्टिंग लाइन छिपाएँ

कभी-कभी आप ब्रांच नाम और कनेक्टिंग लाइन छिपाना चाह सकते हैं। आप यह showBranches सिंटैक्स का उपयोग करके कर सकते हैं। डिफ़ॉल्ट रूप से इसका मान true होता है, आप निर्देश का उपयोग करके इसे false पर सेट कर सकते हैं।

कोड
                            
कॉपी करें
एम्बेड
--- 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

कमिट टैग लेआउट: घुमाया हुआ या क्षैतिज

Mermaid कमिट लेबल लेआउट के दो प्रकारों का समर्थन करता है। डिफ़ॉल्ट लेआउट घुमाया हुआ है, जिसका अर्थ है कि टैग कमिट वृत्त के नीचे रखा जाता है, बेहतर पठनीयता के लिए 45 डिग्री घुमाया जाता है। यह लंबे लेबल वाले कमिट के लिए विशेष रूप से उपयोगी है।

दूसरा प्रकार क्षैतिज है, जिसका अर्थ है कि टैग कमिट वृत्त के नीचे रखा जाता है और क्षैतिज रूप से केंद्रित प्रदर्शित होता है, घुमाया नहीं जाता। यह छोटे लेबल वाले कमिट के लिए विशेष रूप से उपयोगी है।

आप निर्देश में rotateCommitLabel सिंटैक्स का उपयोग करके कमिट लेबल का लेआउट बदल सकते हैं। इसका डिफ़ॉल्ट true है, जिसका अर्थ है कि कमिट लेबल घूमेगा।

उपयोग उदाहरण: घुमाया हुआ कमिट लेबल

कोड
                            
कॉपी करें
एम्बेड
--- 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

उपयोग उदाहरण: क्षैतिज कमिट लेबल

कोड
                            
कॉपी करें
एम्बेड
--- 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

कमिट टैग छिपाएँ

कभी-कभी आप कमिट लेबल छिपाना चाह सकते हैं। आप यह showCommitLabel सिंटैक्स का उपयोग करके कर सकते हैं। डिफ़ॉल्ट रूप से इसका मान true होता है, आप निर्देश का उपयोग करके इसे false पर सेट कर सकते हैं।

कोड
                            
कॉपी करें
एम्बेड
--- 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

मुख्य ब्रांच का नाम अनुकूलित करें

कभी-कभी आप मुख्य ब्रांच का नाम अनुकूलित करना चाह सकते हैं। आप यह mainBranchName सिंटैक्स का उपयोग करके कर सकते हैं। डिफ़ॉल्ट रूप से इसका मान main होता है, आप निर्देश का उपयोग करके इसे किसी भी स्ट्रिंग पर सेट कर सकते हैं।

कोड
                            
कॉपी करें
एम्बेड
--- 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"

Mermaid का उपयोग करके बनाया गया एक काल्पनिक मेट्रो लाइन चार्ट देखें। यहाँ, हमने डिफ़ॉल्ट मुख्य ब्रांच का नाम बदलकर MetroLine1 कर दिया है।

ब्रांच क्रम अनुकूलित करें

Mermaid में, डिफ़ॉल्ट रूप से, ब्रांच ग्राफ़ कोड में उनके परिभाषित या प्रकट होने के क्रम में प्रदर्शित होती हैं।

कभी-कभी आप ब्रांच क्रम अनुकूलित करना चाह सकते हैं। आप यह ब्रांच परिभाषा के साथ order सिंटैक्स का उपयोग करके कर सकते हैं, जिसे आप धनात्मक संख्या पर सेट कर सकते हैं।

Mermaid order सिंटैक्स द्वारा दिए गए प्राथमिकता क्रम का पालन करता है।

  • मुख्य ब्रांच हमेशा सबसे पहले प्रदर्शित होती है, क्योंकि इसका डिफ़ॉल्ट क्रम मान 0 है। (जब तक कि कॉन्फ़िगरेशन में mainBranchOrder सिंटैक्स के माध्यम से इसका क्रम बदलकर 0 से भिन्न न किया गया हो)
  • इसके बाद, सभी ब्रांच जिनमें order नहीं है, वे ग्राफ़ कोड में उनके प्रकट होने के क्रम में प्रदर्शित होंगी।
  • इसके बाद, सभी ब्रांच जिनमें order है, वे उनके order मान के क्रम में प्रदर्शित होंगी।

सभी ब्रांचों के क्रम पर पूर्ण नियंत्रण रखने के लिए, सभी ब्रांचों के लिए order परिभाषित करना आवश्यक है।

कोड
                            
कॉपी करें
एम्बेड
--- config: logLevel: 'debug' theme: 'base' gitGraph: showBranches: true showCommitLabel: true --- gitGraph commit branch test1 order: 3 branch test2 order: 2 branch test3 order: 1

उपरोक्त चित्र में, सभी ब्रांच परिभाषित क्रम का पालन करती हैं।

कोड
                            
कॉपी करें
एम्बेड
--- 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

उपरोक्त चित्र में, जिन ब्रांचों का क्रम निर्दिष्ट नहीं है वे सभी परिभाषित क्रम में बनाई गई हैं। इसके बाद, test4 ब्रांच बनाई गई, क्योंकि उसका क्रम 1 है। फिर, main ब्रांच बनाई गई, क्योंकि उसका क्रम 2 है। अंत में, test1 ब्रांच बनाई गई, क्योंकि उसका क्रम 3 है।

नोट: चूँकि हमने mainBranchOrder को 2 पर ओवरराइड किया है, इसलिए main ब्रांच शुरुआत में नहीं बनाई जाएगी, बल्कि क्रम के अनुसार प्रदर्शित होगी।

यहाँ, हमने डिफ़ॉल्ट मुख्य ब्रांच का नाम बदलकर MetroLine1 कर दिया है।

दिशा

Mermaid तीन दिशाओं का समर्थन करता है: बाएँ से दाएँ (डिफ़ॉल्ट), ऊपर से नीचे और नीचे से ऊपर।

बाएँ से दाएँ (डिफ़ॉल्ट, LR:)

Mermaid में, डिफ़ॉल्ट दिशा बाएँ से दाएँ चलती है, ब्रांच एक-दूसरे के ऊपर स्टैक होती हैं।

हालाँकि, आप gitGraph सिंटैक्स के बाद LR: का उपयोग करके इस मान को स्पष्ट रूप से सेट कर सकते हैं।

कोड
                            
कॉपी करें
एम्बेड
gitGraph LR: commit commit branch develop commit commit checkout main commit commit merge develop commit commit

ऊपर से नीचे (TB:)

ऊपर से नीचे दिशा में, कमिट चार्ट के शीर्ष से निचले भाग तक चलते हैं, ब्रांच अगल-बगल व्यवस्थित होती हैं।

ग्राफ़ को इस तरह ओरिएंट करने के लिए, आपको gitGraph सिंटैक्स के बाद TB: जोड़ना होगा।

कोड
                            
कॉपी करें
एम्बेड
gitGraph TB: commit commit branch develop commit commit checkout main commit commit merge develop commit commit

नीचे से ऊपर (BT:)

नीचे से ऊपर दिशा में, कमिट चार्ट के निचले भाग से शीर्ष तक चलते हैं, ब्रांच अगल-बगल व्यवस्थित होती हैं।

ग्राफ़ को इस तरह ओरिएंट करने के लिए, आपको gitGraph सिंटैक्स के बाद BT: जोड़ना होगा।

कोड
                            
कॉपी करें
एम्बेड
gitGraph BT: commit commit branch develop commit commit checkout main commit commit merge develop commit commit

अस्थायी कमिट (parallelCommits: false)

कोड
                            
कॉपी करें
एम्बेड
--- config: gitGraph: parallelCommits: false --- gitGraph: commit branch develop commit commit checkout main commit commit

समानांतर कमिट (parallelCommits: true)

कोड
                            
कॉपी करें
एम्बेड
--- config: gitGraph: parallelCommits: true --- gitGraph: commit branch develop commit commit checkout main commit commit

थीम

Mermaid कई कस्टम थीम का समर्थन करता है, जिनका उपयोग आप अपने अनुकूल थीम खोजने के लिए कर सकते हैं। नोट: आप वास्तव में मौजूदा थीम के वेरिएबल ओवरराइड करके अपनी कस्टम थीम बना सकते हैं।

निम्नलिखित विभिन्न कस्टम थीम विकल्प हैं:

  • redux-color
  • redux-dark-color
  • redux
  • redux-dark
  • default
  • neutral
  • dark
  • forest
  • neo
  • neo-dark
  • base

थीम बदलने के लिए, आप initialize सिंटैक्स का उपयोग कर सकते हैं।

बेस थीम

कोड
                            
कॉपी करें
एम्बेड
--- 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

फ़ॉरेस्ट थीम

कोड
                            
कॉपी करें
एम्बेड
--- 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

डिफ़ॉल्ट थीम

कोड
                            
कॉपी करें
एम्बेड
--- 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

डार्क थीम

कोड
                            
कॉपी करें
एम्बेड
--- 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

न्यूट्रल थीम

कोड
                            
कॉपी करें
एम्बेड
--- 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

थीम वेरिएबल का उपयोग करके अनुकूलित करें

Mermaid आपको थीम वेरिएबल का उपयोग करके अपने चार्ट को अनुकूलित करने की अनुमति देता है, ये वेरिएबल चार्ट के विभिन्न तत्वों के रूप और शैली को नियंत्रित करते हैं।

समझने के लिए, हम थीम default को उदाहरण के रूप में लेते हैं; थीम वेरिएबल के डिफ़ॉल्ट मान स्वतः थीम से चुने जाते हैं।

ब्रांच का रंग सेट करने के लिए default थीम का उपयोग करें:

कोड
                            
कॉपी करें
एम्बेड
--- 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 थीम वेरिएबल का समर्थन करता है, जो डिफ़ॉल्ट मान ओवरराइड करने के लिए उपयोग होते हैं और अधिकतम 8 ब्रांचों तक ओवरराइड कर सकते हैं, अर्थात आप थीम वेरिएबल का उपयोग करके अधिकतम 8 ब्रांचों के रंग सेट कर सकते हैं। 8 से अधिक ब्रांच होने पर, थीम वेरिएबल चक्रीय रूप से दोबारा उपयोग किए जाएंगे, अर्थात 9वीं ब्रांच पहली ब्रांच की शैली का उपयोग करेगी।

ब्रांच का रंग अनुकूलित करें

आप ब्रांच का रंग अनुकूलित करने के लिए git0 से git7 थीम वेरिएबल का उपयोग कर सकते हैं। Mermaid आपको अधिकतम 8 ब्रांचों के रंग सेट करने की अनुमति देता है, जिसमें git0 वेरिएबल पहली ब्रांच का रंग नियंत्रित करता है, git1 दूसरी ब्रांच का रंग नियंत्रित करता है, और इसी तरह आगे।

नोट: इन थीम वेरिएबल के डिफ़ॉल्ट मान चयनित थीम से चुने जाते हैं। यदि आप डिफ़ॉल्ट मान ओवरराइड करना चाहते हैं, तो आप कस्टम थीम वेरिएबल मान जोड़ने के लिए initialize सिंटैक्स का उपयोग कर सकते हैं।

उदाहरण:

अब आइए git0 से git3 वेरिएबल के डिफ़ॉल्ट मान ओवरराइड करें:

कोड
                            
कॉपी करें
एम्बेड
--- 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

ब्रांच लेबल का रंग अनुकूलित करें

आप ब्रांच लेबल का रंग अनुकूलित करने के लिए gitBranchLabel0 से gitBranchLabel7 थीम वेरिएबल का उपयोग कर सकते हैं। Mermaid आपको अधिकतम 8 ब्रांचों के रंग सेट करने की अनुमति देता है, जिसमें gitBranchLabel0 वेरिएबल पहली ब्रांच लेबल का रंग नियंत्रित करता है, gitBranchLabel1 वेरिएबल दूसरी ब्रांच लेबल का रंग नियंत्रित करता है, और इसी तरह आगे।

आइए देखें कि default थीम का उपयोग करके ब्रांच लेबल का रंग कैसे सेट किया जाता है:

अब आइए gitBranchLabel0 से gitBranchLabel2 वेरिएबल के डिफ़ॉल्ट मान ओवरराइड करें:

कोड
                            
कॉपी करें
एम्बेड
--- 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

यहाँ, आप देख सकते हैं कि branch8 और branch9 के रंग और शैली क्रमशः इंडेक्स स्थिति 0 (main) और 1 (branch1) वाली ब्रांच से चुने गए हैं।

कमिट का रंग अनुकूलित करें

आप commitLabelColor और commitLabelBackground थीम वेरिएबल का उपयोग करके क्रमशः कमिट लेबल का रंग और बैकग्राउंड रंग अनुकूलित कर सकते हैं।

उदाहरण: अब आइए commitLabelColor से commitLabelBackground वेरिएबल के डिफ़ॉल्ट मान ओवरराइड करें:

कोड
                            
कॉपी करें
एम्बेड
--- 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

आप कमिट लेबल का फ़ॉन्ट आकार अनुकूलित करने के लिए commitLabelFontSize थीम वेरिएबल का उपयोग कर सकते हैं।

उदाहरण: अब आइए commitLabelFontSize वेरिएबल के डिफ़ॉल्ट मान ओवरराइड करें:

कोड
                            
कॉपी करें
एम्बेड
--- 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

लेबल फ़ॉन्ट आकार अनुकूलित करें

आप लेबल का फ़ॉन्ट आकार अनुकूलित करने के लिए tagLabelFontSize थीम वेरिएबल का उपयोग कर सकते हैं।

उदाहरण: अब आइए tagLabelFontSize वेरिएबल के डिफ़ॉल्ट मान ओवरराइड करें:

कोड
                            
कॉपी करें
एम्बेड
--- 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

लेबल का रंग अनुकूलित करें

आप tagLabelColor, tagLabelBackground और tagLabelBorder थीम वेरिएबल का उपयोग करके लेबल अनुकूलित कर सकते हैं, अर्थात क्रमशः लेबल टेक्स्ट का रंग, लेबल बैकग्राउंड रंग और लेबल बॉर्डर बदल सकते हैं।

उदाहरण: अब आइए tagLabelColor, tagLabelBackground और tagLabelBorder वेरिएबल के डिफ़ॉल्ट मान ओवरराइड करें:

कोड
                            
कॉपी करें
एम्बेड
--- 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

हाइलाइट कमिट का रंग अनुकूलित करें

आप gitInv0 से gitInv7 थीम वेरिएबल का उपयोग करके ब्रांच के आधार पर हाइलाइट कमिट का रंग अनुकूलित कर सकते हैं। Mermaid आपको अधिकतम 8 ब्रांचों के लिए विशिष्ट हाइलाइट कमिट का रंग सेट करने की अनुमति देता है, जिसमें gitInv0 वेरिएबल पहली ब्रांच के हाइलाइट कमिट का रंग नियंत्रित करता है, gitInv1 वेरिएबल दूसरी ब्रांच के हाइलाइट कमिट का रंग नियंत्रित करता है, और इसी तरह आगे।

अब आइए git0 से git3 वेरिएबल के डिफ़ॉल्ट मान ओवरराइड करें:

कोड
                            
कॉपी करें
एम्बेड
--- 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