निःशुल्क · साइन-अप नहीं · .mmd फ़ाइलों के साथ काम करता है

Mermaid गैंट चार्ट एडिटर

गैंट चार्ट काम को कैलेंडर पर रखता है: क्या कितना चलता है, क्या ऊपर-नीचे पड़ता है, और क्या तब तक शुरू नहीं हो सकता जब तक कुछ और ख़त्म न हो। इसे तब उठाइए जब तारीख़ें और निर्भरताएँ ही मूल बात हों। अगर आपको सिर्फ़ क्रम चाहिए और तारीख़ें नहीं, तो फ़्लोचार्ट हल्का है और समय-सारणी खिसकते ही सड़ता नहीं।

निर्भरताओं और एक मील के पत्थर वाली रिलीज़ योजना

जो चीज़ इसे पट्टियों के चित्र से गैंट चार्ट बनाती है वह `after a1` है: निर्भरता घोषित है, इसलिए पहला काम खिसकाने पर उसके बाद का सब कुछ खिंच जाता है। मील का पत्थर एक तय तारीख़ बताता है जो समय नहीं लेती। `dateFormat DD/MM/YYYY` वाली पंक्ति वैकल्पिक नहीं है: उसके बिना आप नीचे बताए तारीख़ वाले जाल में गिरते हैं।

gantt
    title रिलीज़ 2.4
    dateFormat DD/MM/YYYY
    axisFormat %d/%m
    excludes weekends

    section विकास
    एपीआई अनुबंध        :done,      a1, 07/01/2026, 10d
    कार्यान्वयन          :active,    a2, after a1, 20d
    आंतरिक परीक्षण       :           a3, after a2, 8d

    section रिलीज़
    स्थिरीकरण अवधि       :           b1, after a3, 5d
    रिलीज़ का निर्णय     :milestone, m1, after b1, 0d
    प्रोडक्शन में तैनाती :crit,      b2, after m1, 3d
इसे एडिटर में खोलें
विज्ञापन

हल किए गए उदाहरण

1. सबसे सरल सही चार्ट

`dateFormat` Mermaid को बताता है कि आपकी लिखी तारीख़ें कैसे पढ़नी हैं; `axisFormat` तय करता है कि वे धुरी पर कैसे दिखेंगी। ये दो अलग सेटिंग हैं, और इन्हें आपस में मिला देना गैंट के साथ सबसे आम झुँझलाहट की जड़ है।

gantt
    title स्प्रिंट 14
    dateFormat DD/MM/YYYY
    section काम
    खोज सुविधा बनाएँ :02/03/2026, 10d
एडिटर में खोलें

2. कार्य-पहचान और निर्भरताएँ

किसी काम को पहचान देने से बाद के काम `after <पहचान>` लिख पाते हैं। निर्भरताएँ घोषित हों तो आप शुरुआत की तारीख़ एक ही जगह बदलते हैं और बाक़ी योजना अपने आप पीछे चली आती है।

gantt
    title डेटा स्थानांतरण
    dateFormat DD/MM/YYYY
    section तैयारी
    स्कीमा की समीक्षा    :a1, 02/02/2026, 5d
    मैपिंग लिखें         :a2, after a1, 8d
    section निष्पादन
    पूर्वाभ्यास           :a3, after a2, 3d
    अदला-बदली            :a4, after a3, 1d
एडिटर में खोलें

3. स्थिति के कुंजी-शब्द

`done`, `active` और `crit` पट्टी बनाने का ढंग बदल देते हैं। यह चार्ट से «हम कहाँ हैं» का जवाब दिलाने का सबसे सस्ता तरीका है, न कि सिर्फ़ «योजना क्या थी» का।

gantt
    title प्लेटफ़ॉर्म, पहली तिमाही
    dateFormat DD/MM/YYYY
    section अवसंरचना
    Terraform की सफ़ाई   :done,   t1, 05/01/2026, 12d
    Kubernetes उन्नयन    :active, t2, 19/01/2026, 15d
    लागत की समीक्षा      :        t3, after t2, 5d
    section सुरक्षा
    निर्भरता जाँच        :crit,   s1, 12/01/2026, 6d
एडिटर में खोलें

4. मील के पत्थर

मील का पत्थर एक बिंदु है, अवधि नहीं: उसे `0d` दें। इन्हें उन तारीख़ों के लिए रखें जो परियोजना के बाहर से तय होती हैं — कोई प्रदर्शनी, कोई अनुबंध की समय-सीमा, कोई कोड फ़्रीज़।

gantt
    title लॉन्च योजना
    dateFormat DD/MM/YYYY
    section इंजीनियरिंग
    दायरा तय करें        :milestone, m1, 01/04/2026, 0d
    बग खोज               :          e1, 01/04/2026, 5d
    रिलीज़ शाखा          :milestone, m2, after e1, 0d
    section संचार
    प्रेस रोक समाप्त     :milestone, m3, 15/04/2026, 0d
एडिटर में खोलें

5. सप्ताहांत और छुट्टियाँ हटाना

`excludes weekends` से अवधियाँ शनिवार-रविवार नहीं गिनतीं, इसलिए 10 दिन का काम सप्ताहांत के बीच ख़त्म होने के बजाय दो कार्य-सप्ताह लेता है। छुट्टियाँ एक-एक तारीख़ से हटाई जाती हैं; भारत में 26 जनवरी, 15 अगस्त और 2 अक्तूबर के आसपास इसका असर साफ़ दिखता है।

gantt
    title नई सेवा शुरू करना
    dateFormat DD/MM/YYYY
    excludes weekends, 15/08/2026, 02/10/2026

    section निर्माण
    अवसंरचना खड़ी करें   :p1, 10/08/2026, 5d
    CI/CD जोड़ें         :p2, after p1, 5d
    section हस्तांतरण
    मार्गदर्शिका और प्रशिक्षण :p3, after p2, 4d
एडिटर में खोलें

गैंट सिंटैक्स का सार

छहों प्रकारों में गैंट सिर्फ़ एक जगह — कार्य-पंक्ति में — सबसे कम उदार है, और बाक़ी हर चीज़ में सबसे ज़्यादा। ठीक इसी वजह से इसमें इतनी ग़लतियाँ बिना देखे निकल जाती हैं।

सिंटैक्सअर्थ
ganttआरेख खोलता है।
title पाठचार्ट का शीर्षक।
dateFormat DD/MM/YYYYआपकी लिखी तारीख़ें कैसे पढ़ी जाएँ। हिंदी के लिए यही सही पंक्ति है।
dateFormat YYYY-MM-DDISO रूप, डिफ़ॉल्ट सेटिंग।
axisFormat %d/%mधुरी पर तारीख़ें कैसे दिखें। dateFormat से अलग सेटिंग।
excludes weekendsअवधि गिनते समय शनिवार-रविवार छोड़ें।
excludes 15/08/2026कोई ख़ास तारीख़ हटाएँ। छुट्टियाँ ऐसे ही निकाली जाती हैं।
section नामकामों को एक नामित पट्टी में समूहित करता है।
काम :id, 01/01/2026, 10dस्पष्ट शुरुआत और अवधि वाला काम।
काम :id, after दूसरा, 10dवह काम जो `दूसरा` ख़त्म होने पर शुरू होता है।
काम :done, id, ...पूरा — फीका बनता है।
काम :active, id, ...चल रहा — उभारकर बनता है।
काम :crit, id, ...महत्वपूर्ण — ज़ोर देने वाले रंग में बनता है।
नाम :milestone, id, तारीख़, 0dसमय का एक बिंदु, अवधि नहीं।
10d / 3w / 2hदिन, सप्ताह, घंटे में अवधि। इकाई अनिवार्य है।
विज्ञापन

गैंट के छह जाल — और उनमें से सिर्फ़ एक त्रुटि है

यही गैंट को बाक़ी पाँच प्रकारों से अलग करता है। Mermaid 11.12.2 पर दोबारा बनाया गया: नीचे के छह में से ठीक एक बनना रोकता है। बाक़ी पाँच पूरी तरह भरोसेमंद और ग़लत समय-सारणी देते हैं, जो कहीं ज़्यादा ख़तरनाक है, क्योंकि जो चार्ट बन गया उसे कोई दोबारा नहीं जाँचता।

आपको क्या दिखता है

Parse error जो `Expecting 'taskData', got 'NL'` पर ख़त्म होती है

क्यों

बिना कोलन वाली कार्य-पंक्ति। कोलन दिखने वाले नाम को कार्य-डेटा से अलग करता है, और उसके बिना पार्स करने को कुछ बचता ही नहीं। इस सूची का यही अकेला जाल है जिसे Mermaid खुलकर ठुकराता है।

समाधान

नाम और पहचान के बीच कोलन लगाएँ।

ग़लत
gantt
    dateFormat DD/MM/YYYY
    section काम
    डिज़ाइन a1, 07/01/2026, 5d
सही
gantt
    dateFormat DD/MM/YYYY
    section काम
    डिज़ाइन :a1, 07/01/2026, 5d

आपको क्या दिखता है

चार्ट बन जाता है, पर तारीख़ें दो महीने पहले गिरती हैं

क्यों

यह हिंदी में लिखते समय की सबसे महँगी ग़लती है। हम 01/03/2026 लिखते हैं और 1 मार्च समझते हैं, पर डिफ़ॉल्ट `dateFormat` ISO है, और विभाजक वाली तारीख़ को Mermaid अमेरिकी क्रम में पढ़ता है, महीना पहले। मापा गया: `dateFormat YYYY-MM-DD` के साथ `01/03/2026` उस काम को 3 जनवरी पर रख देता है। कोई चेतावनी नहीं; चार्ट बिलकुल ठीक दिखता है और दो महीने खिसका होता है। बिंदु या हाइफ़न लगाने से भी कुछ नहीं बदलता।

समाधान

`dateFormat DD/MM/YYYY` घोषित करें और तारीख़ें हमेशा की तरह लिखें। जाँचा गया: इस रूप के साथ `01/03/2026` ठीक 1 मार्च पर गिरता है।

ग़लत
gantt
    dateFormat YYYY-MM-DD
    axisFormat %d/%m/%Y
    section स
    डिज़ाइन :a1, 01/03/2026, 10d
सही
gantt
    dateFormat DD/MM/YYYY
    axisFormat %d/%m/%Y
    section स
    डिज़ाइन :a1, 01/03/2026, 10d

आपको क्या दिखता है

चार्ट बन जाता है, पर धुरी अचानक कई महीनों तक फैल जाती है

क्यों

कोई `after` ऐसी कार्य-पहचान की ओर इशारा करता है जो है ही नहीं — प्रायः टाइपो या बदला हुआ नाम। Mermaid चेतावनी नहीं देता: वह उस काम को किसी भी बिंदु पर रख देता है, जिससे धुरी उस तक पहुँचने के लिए खिंच जाती है। दस-दस दिन के दो काम आठ महीने फैली धुरी पर पहुँच सकते हैं।

समाधान

जाँचें कि हर `after <पहचान>` किसी घोषित पहचान से ठीक-ठीक मेल खाती है। धुरी के पैमाने का अचानक बदलना ही संकेत है।

ग़लत
gantt
    dateFormat DD/MM/YYYY
    section स
    डिज़ाइन :a1, 07/01/2026, 10d
    निर्माण :a2, after design, 10d
सही
gantt
    dateFormat DD/MM/YYYY
    section स
    डिज़ाइन :a1, 07/01/2026, 10d
    निर्माण :a2, after a1, 10d

आपको क्या दिखता है

कार्य का नाम पहले कोलन पर कट जाता है

क्यों

कार्य के नाम में कोलन है। पहला कोलन ही विभाजक है, इसलिए उसके बाद सब कुछ कार्य-डेटा समझा जाता है: `चरण 1: डिज़ाइन` सिर्फ़ `चरण 1` नाम के काम के रूप में बनता है और डिज़ाइन शब्द ग़ायब हो जाता है। सेक्शन के नाम इससे अछूते रहते हैं — जाँचा गया।

समाधान

कार्य के नामों में कोलन न रखें। डैश लगाएँ या ब्योरा सेक्शन के नाम में ले जाएँ।

ग़लत
gantt
    dateFormat DD/MM/YYYY
    section स
    चरण 1: डिज़ाइन :a1, 07/01/2026, 10d
सही
gantt
    dateFormat DD/MM/YYYY
    section स
    चरण 1 — डिज़ाइन :a1, 07/01/2026, 10d

आपको क्या दिखता है

पट्टी सिकुड़कर ख़त्म हो जाती है

क्यों

बिना इकाई की अवधि। `5` का मतलब पाँच दिन नहीं है: इकाई अनिवार्य है और उसके बिना काम को कोई सार्थक लंबाई नहीं मिलती। चार्ट फिर भी बन जाता है, ऐसे काम के साथ जो मानो समय ही न लेता हो।

समाधान

इकाई हमेशा लिखें: `5d`, `3w`, `2h`।

ग़लत
gantt
    dateFormat DD/MM/YYYY
    section स
    डिज़ाइन :a1, 07/01/2026, 5
सही
gantt
    dateFormat DD/MM/YYYY
    section स
    डिज़ाइन :a1, 07/01/2026, 5d

आपको क्या दिखता है

अवधियाँ सही हैं, पर समाप्ति की तारीख़ें हक़ीक़त से नहीं मिलतीं

क्यों

`excludes weekends` नहीं है। डिफ़ॉल्ट रूप से 10 दिन का काम सप्ताहांत सहित दस कैलेंडर दिन है, इसलिए एक कार्य-सप्ताह से लंबी हर चीज़ चार्ट पर व्यवहार से पहले ख़त्म होती है। भारत में इसमें त्योहारों की छुट्टियाँ भी जुड़ती हैं, और एक तिमाही भर में जमा हुआ अंतर बैठक में बचाना मुश्किल हो जाता है।

समाधान

शुरुआत के पास `excludes weekends` जोड़ें, उसके बाद छुट्टियों की तारीख़ें — बशर्ते काम सचमुच सातों दिन न चलता हो।

ग़लत
gantt
    dateFormat DD/MM/YYYY
    section स
    स्थानांतरण :a1, 10/08/2026, 10d
सही
gantt
    dateFormat DD/MM/YYYY
    excludes weekends, 15/08/2026
    section स
    स्थानांतरण :a1, 10/08/2026, 10d

बनने के बारे में टिप्पणियाँ

Mermaid 11.12.2 पर मापा गया, वही संस्करण जो यह साइट चलाती है। गैंट बाक़ी सभी प्रकारों से अलग बरतता है।

इकलौता प्रकार जिसकी चौड़ाई तय है

इस साइट के बाक़ी सभी आरेख उसी दिशा में बढ़ते हैं जिसमें उनकी सामग्री बढ़ती है। गैंट चार्ट के viewBox की चौड़ाई हमेशा 1264 पिक्सल रहती है, चाहे उसमें तीन काम हों या चालीस; सिर्फ़ ऊँचाई बदलती है, जो लगभग 172 से 1060 पिक्सल के बीच मापी गई। धुरी उसी तय चौड़ाई में समाने के लिए दबाई या खींची जाती है, और इसीलिए दो साल की योजना और दो हफ़्ते की योजना बराबर घनी दिखती हैं। अगर पट्टियाँ इतनी पतली निकलें कि पढ़ी न जाएँ, तो समस्या तारीख़ों के दायरे में है, कामों की संख्या में नहीं।

यहाँ देवनागरी पर कोई पाबंदी नहीं है

यह राहत की बात है और कहने लायक है। फ़्लोचार्ट की नोड-पहचान और क्लास के नाम में देवनागरी अस्वीकार होती है, पर गैंट में ऐसी कोई जगह है ही नहीं: कार्य के नाम और सेक्शन के नाम लेबल हैं, पहचान नहीं। जाँचा गया — `section नियोजन` और `आवश्यकता विश्लेषण` दोनों ज्यों के त्यों बनते हैं, और उनमें स्थान भी चलते हैं। कार्य के नाम में मना सिर्फ़ कोलन है। यानी पूरी साइट पर गैंट वह प्रकार है जिसमें हिंदी को कुछ भी बदलना नहीं पड़ता।

स्लैश मदद नहीं करता — पढ़ाई अमेरिकी ही रहती है

इसे यहाँ दोहरा रहा हूँ क्योंकि हिंदी में लिखते समय यही सबसे महँगा जाल है। मापा गया: `dateFormat YYYY-MM-DD` के साथ `01/03/2026` न त्रुटि देता है न चेतावनी, बस 3 जनवरी पर बैठ जाता है — विभाजक के रूप में स्लैश इंजन को किसी तरह यह संकेत नहीं देता कि यह दिन और फिर महीना है। बिंदु के साथ भी वही होता है। घोषित `dateFormat DD/MM/YYYY` इसे पूरी तरह हल कर देता है। हर हिंदी गैंट में जोड़ने लायक पहली पंक्ति यही है।

PNG निर्यात पिक्सल तक सही है

गैंट अपने लेबल अंतःस्थापित HTML के बजाय सामान्य SVG पाठ के रूप में बनाता है, इसलिए — फ़्लोचार्ट तथा क्लास, स्टेट और ER आरेखों के विपरीत — वह सीधे रैस्टर हो जाता है। निर्यात किया गया PNG स्क्रीन से बिलकुल मेल खाता है, बिना दोबारा बनाए और बिना पाठ की टाइपसेटिंग खिसके।

व्याकरण कोलन को छोड़कर हर जगह ढीला है

ग़ायब सेक्शन, अनजाने स्थिति-कुंजी-शब्द, ग़लत रूप वाली तारीख़ें और बिना इकाई की अवधियाँ — सब बन जाता है। ठुकराई सिर्फ़ वही कार्य-पंक्ति जाती है जिसमें कोलन नहीं। यह असंतुलन गैंट चार्ट लिखने के बारे में जानने लायक सबसे उपयोगी बात है: चार्ट का बन जाना इस बारे में लगभग कुछ नहीं कहता कि वह सही है या नहीं।

कब कोई दूसरा आरेख बेहतर है

अगर तारीख़ें अंदाज़े हैं, तो गैंट चार्ट उन्हें ऐसी सटीकता से पेश करता है जिसके वे हक़दार नहीं, और बाद में कोई आपको यह याद दिलाएगा। बिना तारीख़ों के क्रम दिखाने वाला फ़्लोचार्ट ज़्यादा ईमानदार है और समय-सारणी खिसकने पर सुधार नहीं माँगता।

अगर योजना हर हफ़्ते बदलती है, तो संस्करण-नियंत्रण में रखा पाठ-आधारित गैंट सचमुच अच्छा है — डिफ़ से दिख जाता है कि क्या खिसका — पर जिस आरेख को कोई अद्यतन नहीं करता वह आरेख न होने से बुरा है। ठंडे दिमाग़ से तय कीजिए कि आप दोनों में से कौन-सा बना रहे हैं।

और काम के बोझ के संतुलन, क्षमता या व्यक्तियों को काम बाँटने से जुड़ी हर बात के लिए यह ग़लत औज़ार है। Mermaid कैलेंडर पर पट्टियाँ खींचता है; उसे यह नहीं पता कि काम कौन करता है या वह व्यक्ति पहले से व्यस्त है या नहीं।

अन्य आरेख प्रकार

लिखा Dominik Malsch · अंतिम अद्यतन:

एडिटर खोलें →