การทดสอบไดอะแกรม Mermaid

graph TD
    A[เริ่มต้น] --> B{ดำเนินการต่อหรือไม่?}
    B -->|ใช่| C[ดำเนินการ]
    B -->|ไม่ใช่| D[สิ้นสุด]
    C --> E[ตรวจสอบผลลัพธ์]
    E --> F{สำเร็จหรือไม่?}
    F -->|ใช่| G[เสร็จสิ้น]
    F -->|ไม่ใช่| H[ลองใหม่]
    H --> C
    G --> D

sequenceDiagram
    participant ผู้ใช้
    participant ระบบ
    participant ฐานข้อมูล

    ผู้ใช้->>ระบบ: ส่งคำขอ
    ระบบ->>ฐานข้อมูล: ค้นหาข้อมูล
    ฐานข้อมูล-->>ระบบ: ส่งคืนผลลัพธ์
    ระบบ-->>ผู้ใช้: แสดงผลลัพธ์

gantt
    title ตารางเวลาโครงการ
    dateFormat  YYYY-MM-DD
    section การออกแบบ
    วิเคราะห์ความต้องการ     :เสร็จแล้ว,    des1, 2024-01-01, 7d
    ออกแบบต้นแบบ     :กำลังดำเนินการ,  des2, 2024-01-08, 5d
    ออกแบบรายละเอียด     :         des3, after des2, 5d
    section การพัฒนา
    พัฒนาด้านหน้าบ้าน     :         dev1, after des3, 10d
    พัฒนาด้านหลังบ้าน     :         dev2, after des3, 15d
    section การทดสอบ
    ทดสอบหน่วย     :         test1, after dev1, 5d
    ทดสอบบูรณาการ     :         test2, after dev2, 5d

classDiagram
    class สัตว์ {
        +String ชื่อ
        +int อายุ
        +void กิน()
        +void นอน()
    }
    class สุนัข {
        +void เห่า()
    }
    class แมว {
        +void ร้อง()
    }

    สัตว์ <|-- สุนัข
    สัตว์ <|-- แมว

stateDiagram-v2
    [*] --> รออยู่
    รออยู่ --> กำลังประมวลผล : เริ่มประมวลผล
    กำลังประมวลผล --> สำเร็จ : ประมวลผลสำเร็จ
    กำลังประมวลผล --> ผิดพลาด : ประมวลผลล้มเหลว
    สำเร็จ --> [*]
    ผิดพลาด --> [*]

pie title อัตราการใช้เบราว์เซอร์
    "Chrome" : 65.2
    "Firefox" : 15.3
    "Safari" : 12.5
    "Edge" : 5.2
    "อื่นๆ" : 1.8

graph TD
    A --> B
    // ขาดการกำหนดลูกศรที่นี่
    C --> D