उन्नत Mermaid उदाहरण

← Markdown उदाहरणों पर वापस जाएँ

इन टेम्पलेट को अपने आरेखों के आरंभिक बिंदु के रूप में उपयोग करें।

निर्णय फ़्लोचार्ट

flowchart TD
    Start([शुरू]) --> Input[/डेटा इनपुट/]
    Input --> Process{प्रोसेस करें?}
    Process -->|हाँ| Execute[कार्य चलाएँ]
    Process -->|नहीं| Skip[छोड़ें]
    Execute --> Check{सफल?}
    Check -->|हाँ| Success[✅ सफलता]
    Check -->|नहीं| Retry{फिर प्रयास करें?}
    Retry -->|हाँ| Execute
    Retry -->|नहीं| Fail[❌ असफलता]
    Skip --> End([समाप्त])
    Success --> End
    Fail --> End

स्थिति आरेख

stateDiagram-v2
    [*] --> निष्क्रिय
    निष्क्रिय --> लोड: अपलोड
    लोड --> प्रोसेस: फ़ाइलें लोड हुईं
    प्रोसेस --> सहेजना: सत्यापित
    सहेजना --> सफलता: सहेजा गया
    सहेजना --> त्रुटि: असफल
    सफलता --> निष्क्रिय: पूरा
    त्रुटि --> निष्क्रिय: फिर प्रयास
    त्रुटि --> [*]: रद्द करें

समयरेखा

timeline
    title परियोजना विकास
    section चरण 1
        सेटअप : परियोजना विन्यास
              : निर्भरता स्थापना
    section चरण 2
        IndexedDB : डेटाबेस कार्यान्वयन
                  : स्थायित्व परीक्षण
    section चरण 3
        घटक : घटक निर्माण
             : इंटरफ़ेस एकीकरण
    section चरण 4
        परीक्षण : कार्यात्मक परीक्षण
               : ऑफ़लाइन परीक्षण
    section चरण 5
        रिलीज़ : उत्पादन बिल्ड
               : वितरण

इकाई-संबंध आरेख

erDiagram
    FILE ||--o{ FOLDER : belongs_to
    FILE {
        int id PK
        string path
        string name
        text content
        datetime createdAt
        datetime updatedAt
    }
    FOLDER {
        int id PK
        string path
        string name
    }
    USER ||--o{ FILE : creates
    USER {
        int id PK
        string name
    }

Gantt चार्ट

gantt
    title परियोजना समय-सारिणी
    dateFormat YYYY-MM-DD
    section योजना
    आवश्यकताएँ परिभाषित करें :a1, 2025-10-01, 3d
    प्रोटोटाइप बनाएँ          :a2, after a1, 2d
    section विकास
    परियोजना तैयार करें       :b1, 2025-10-06, 1d
    IndexedDB लागू करें       :b2, after b1, 2d
    घटक बनाएँ                 :b3, after b2, 3d
    इंटरफ़ेस एकीकृत करें       :b4, after b3, 2d
    section परीक्षण
    इकाई परीक्षण              :c1, after b4, 2d
    एकीकरण परीक्षण            :c2, after c1, 2d
    section रिलीज़
    उत्पादन बिल्ड             :d1, after c2, 1d
    वितरण                     :d2, after d1, 1d

माइंड मैप

mindmap
  root((Raziel.MD))
    सुविधाएँ
      अपलोड
        खींचकर छोड़ें
        फ़ाइल चयनकर्ता
        फ़ोल्डर चयनकर्ता
      पठन
        Markdown
        Mermaid आरेख
        सिंटैक्स हाइलाइटिंग
      संग्रहण
        IndexedDB
        ऑफ़लाइन उपयोग
        PWA
    तकनीक
      इंटरफ़ेस
        Vue 3
        TypeScript
        TailwindCSS
      लाइब्रेरी
        Marked.js
        Mermaid.js
        Dexie.js
    अनुभव
      गहरा मोड
      खोज
      नेविगेशन
      अनुक्रियाशील लेआउट

आरेख के प्रकार

Mermaid कई प्रकार देता है:

• ✅ फ़्लोचार्ट
• ✅ अनुक्रम आरेख
• ✅ क्लास आरेख
• ✅ स्थिति आरेख
• ✅ इकाई-संबंध आरेख
• ✅ Gantt चार्ट
• ✅ पाई चार्ट
• ✅ Git ग्राफ़
• ✅ समयरेखा
• ✅ माइंड मैप

अपने आरेख बनाकर देखें।

आगे देखें

• पूरा Markdown उदाहरण
• Markdown उदाहरणों पर वापस जाएँ