مكتبة الرسوم البيانية لجافا سكريبت مفتوحة المصدر

الشروع في العمل مع mxGraph

الطريقة الموصى بها لتثبيت mxGraph هي عبر npm ، وهي متوفرة عبر مدير الحزم npm. لاستخدام mxGraph كعنصر تبعية ، استخدم تثبيت npm.

npm install mxgraph --save

إنشاء الرسوم البيانية عبر JavaScript API

توفر مكتبة mxGraph مفتوحة المصدر وظائف لإنشاء رسم تخطيطي أو رسوم بيانية باستخدام JavaScript. كما أنه يدعم تعديل الرسوم البيانية المعقدة عن طريق إنشاء برامج تحرير جديدة للرسوم البيانية أو تخصيصها. أولاً ، تحتاج إلى إنشاء رسم بياني داخل الحاوية المحددة ثم يمكنك بسهولة إضافة خلايا إلى النموذج لإنشاء الرسم البياني. يمكنك بسهولة إضافة عناوين المخططات ووضع الملاحظات على عدة مشاركين. توفر المكتبة أيضًا ميزات إضافية مثل التأثيرات المرئية والتحكم في واجهة المستخدم والمزيد.

دمج رسمين بيانيين عبر جافا سكريبت

يتيح mxGraph لمبرمجي الكمبيوتر دمج رسمين بيانيين داخل تطبيقات JavaScript الخاصة بهم. بادئ ذي بدء ، تحتاج إلى إنشاء رسم بياني عينة داخل الحاوية المحددة. من فضلك اجعل جميع الخلايا مستديرة بعلامة بيضاء غامقة. الآن يرجى إنشاء نموذج الرسم البياني الثاني بدون حاوية. أضف خلايا إلى النموذج المستهدف في خطوة واحدة باستخدام معرفات مخصصة للرؤوس. يمكنك الآن دمج النموذج من الرسم البياني الثاني في نموذج الرسم البياني الأول.

رسم الشبكة باستخدام JavaScript

تمكن مكتبة mxGraph مطوري البرامج من رسم شبكة ديناميكيًا داخل تطبيقات JavaScript الخاصة بهم. يمكنك بسهولة رسم شبكة ديناميكيًا باستخدام لوحة HTML 5. أولاً ، يرجى إنشاء الرسم البياني داخل الحاوية المحددة وإنشاء شبكة ديناميكيًا تتطلب لوحة قماشية. تحتاج إلى تعديل تصفية الأحداث لقبول اللوحة القماشية كحاوية. الآن c يعرض الخلفية إذا لزم الأمر ويعين مسافة خطوط الشبكة بالبكسل. الآن يرسم الشبكة الفعلية.