·dagre-react-flow
</>

dagre-react-flow

تخطيط الرسم البياني التلقائي باستخدام dagre مع React Flow (@xyflow/react). يُستخدم عند تنفيذ التخطيط التلقائي أو التخطيطات الهرمية أو الهياكل الشجرية أو ترتيب العقد برمجيًا. المشغلات على dagre، والتخطيط التلقائي، والتخطيط التلقائي، وgetLayoutedElements، وrankdir، والرسم البياني الهرمي.

83التثبيتات·1الرائج·@existential-birds

التثبيت

$npx skills add https://github.com/existential-birds/beagle --skill dagre-react-flow

كيفية تثبيت dagre-react-flow

ثبّت مهارة الذكاء الاصطناعي dagre-react-flow بسرعة في بيئة التطوير لديك عبر سطر الأوامر

  1. افتح الطرفية: افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal
  2. نفّذ أمر التثبيت: انسخ ونفّذ هذا الأمر: npx skills add https://github.com/existential-birds/beagle --skill dagre-react-flow
  3. تحقق من التثبيت: بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw

المصدر: existential-birds/beagle.

Dagre is a JavaScript library for laying out directed graphs. It computes optimal node positions for hierarchical/tree layouts. React Flow handles rendering; dagre handles positioning.

| TB | Top to Bottom | Org charts, decision trees | | BT | Bottom to Top | Dependency graphs (deps at bottom) | | LR | Left to Right | Timelines, horizontal flows | | RL | Right to Left | RTL layouts |

weight: Higher weight edges are prioritized for shorter, more direct paths.

تخطيط الرسم البياني التلقائي باستخدام dagre مع React Flow (@xyflow/react). يُستخدم عند تنفيذ التخطيط التلقائي أو التخطيطات الهرمية أو الهياكل الشجرية أو ترتيب العقد برمجيًا. المشغلات على dagre، والتخطيط التلقائي، والتخطيط التلقائي، وgetLayoutedElements، وrankdir، والرسم البياني الهرمي. المصدر: existential-birds/beagle.

حقائق جاهزة للاقتباس

حقول وأوامر مستقرة للاقتباس في أنظمة الذكاء الاصطناعي والبحث.

أمر التثبيت
npx skills add https://github.com/existential-birds/beagle --skill dagre-react-flow
الفئة
</>أدوات التطوير
موثق
أول ظهور
2026-02-01
آخر تحديث
2026-03-10

Browse more skills from existential-birds/beagle

إجابات سريعة

ما هي dagre-react-flow؟

تخطيط الرسم البياني التلقائي باستخدام dagre مع React Flow (@xyflow/react). يُستخدم عند تنفيذ التخطيط التلقائي أو التخطيطات الهرمية أو الهياكل الشجرية أو ترتيب العقد برمجيًا. المشغلات على dagre، والتخطيط التلقائي، والتخطيط التلقائي، وgetLayoutedElements، وrankdir، والرسم البياني الهرمي. المصدر: existential-birds/beagle.

كيف أثبّت dagre-react-flow؟

افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/existential-birds/beagle --skill dagre-react-flow بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw

أين مستودع المصدر؟

https://github.com/existential-birds/beagle

التفاصيل

الفئة
</>أدوات التطوير
المصدر
skills.sh
أول ظهور
2026-02-01