مولّد مخططات الحالات
اكتب الانتقالات بين الحالات واحصل على مخطط آلة حالات مع الأحداث على الأسهم.
تتم المعالجة محليًا في متصفحك/ بياناتك تبقى في متصفحك.
ما هي أداة مولّد مخططات الحالات؟
يصف مخطط الحالات (آلة الحالات المنتهية) الحالات التي يمكن أن يكون عليها كائن أو عملية والأحداث التي تنقله من حالة إلى أخرى. ويُستخدم في دورة حياة الطلبات ومسارات الواجهات ومعالجة البروتوكولات ومنطق الألعاب.
في الوضع السريع تكتب انتقالًا واحدًا في كل سطر "من -> إلى: الحدث"، وتستخدم [*] للبداية والنهاية. تحوّل الأداة ذلك إلى كود Mermaid من نوع stateDiagram-v2 مع أسماء مستعارة للأسماء التي تحتوي مسافات، وتعرض الكود المولَّد بجانب المخطط. ويمكنك أيضًا لصق كود stateDiagram الخاص بك مع حالات مركبة وتفرعات وملاحظات وضبط اتجاه التخطيط.
كيف تعمل؟
- اكتب الانتقالات مثل "Idle -> Processing: submit"، واحدًا في كل سطر، واستخدم [*] للحالة الابتدائية والنهائية.
- أو الصق كود stateDiagram-v2 للحالات المركبة والاختيارات والملاحظات.
- اختر اتجاه التخطيط والسمة.
- صدّر SVG أو PNG، أو انسخ كود Mermaid المولَّد.
حالات الاستخدام الشائعة
- نمذجة دورة حياة طلب: أُنشئ، دُفع، شُحن، سُلّم، أُلغي.
- توثيق مسار واجهة أو معالج مع الحدث الذي يسبب كل تغيير شاشة.
- وصف بروتوكول شبكة أو آلة حالات اتصال.
- تخطيط منطق لعبة أو محرك سير عمل قبل برمجته.
أمثلة
جرّب هذا المدخل في الأداة أعلاه:
stateDiagram-v2
direction LR
[*] --> Idle
Idle --> Processing : submit
Processing --> Success : ok
Processing --> Failed : error
Failed --> Idle : retry
Success --> [*]الخصوصية
تعمل أداة مولّد مخططات الحالات بالكامل داخل متصفحك. يُعالَج النص أو الملفات التي تقدّمها على جهازك ولا تُرفع ولا تُسجَّل ولا تُخزَّن على خوادمنا.
القيود
يغطي المخطط النصي السريع الانتقالات البسيطة فقط. أما الحالات المركبة والتفرعات والوصلات والاختيارات والملاحظات فتتطلب كود stateDiagram-v2. يرسم Mermaid المخطط لكنه لا يتحقق من اكتمال الآلة أو حتميتها.
الأسئلة الشائعة
كيف أحدد حالتي البداية والنهاية؟
استخدم [*] كمصدر للحالة الابتدائية ("[*] -> Idle") وكهدف للحالة النهائية ("Done -> [*]").
هل يمكن أن تحتوي أسماء الحالات على مسافات؟
نعم. يُعلن اسم مثل "بانتظار الدفع" كحالة ذات تسمية ومعرّف مولَّد، فتظل الانتقالات بصياغة Mermaid صالحة.
ما الفرق بين stateDiagram وstateDiagram-v2؟
stateDiagram-v2 هو محرك العرض الأحدث بتخطيط أفضل وميزات أكثر. ويولّد وضع المخطط النصي دائمًا كود v2.
أدوات ذات صلة
محرر Mermaid المباشر
محرر Mermaid حر: اكتب المخطط ككود واحصل على عرض مباشر يمكن تصديره.
Markdown والمخططات
مولّد المخططات الانسيابية
صِف العملية بسلسلة خطوات في كل سطر واحصل على مخطط انسيابي مع كود Mermaid الذي يقف خلفه.
Markdown والمخططات
مولّد مخططات التسلسل
اكتب رسالة في كل سطر وشاهد من يتحدث إلى من وبأي ترتيب على هيئة مخطط تسلسل.
Markdown والمخططات
مولّد مخططات الأصناف
اكتب كود classDiagram مع الأصناف والأعضاء والعلاقات وشاهد مخطط UML فورًا.
Markdown والمخططات
مولّد مخططات ER
صِف جداولك ومفاتيحك وعلاقاتك ككود Mermaid من نوع erDiagram وشاهد مخطط ER فورًا.
Markdown والمخططات
محرر Markdown مع معاينة مباشرة
اكتب أو الصق نص Markdown في جهة واقرأ النتيجة المعروضة في الجهة الأخرى، مع إحصاءات فورية للمستند.
Markdown والمخططات