joint

JointJS - مكتبة رسم تخطيطي لجافا سكريبت تعمل على تشغيل واجهات المستخدم الاستثنائية

JointJS عبارة عن مكتبة مخططات جافا سكريبت / Typescript تم اختبارها وإثبات كفاءتها، وهي تساعد المطورين والشركات من أي حجم على إنشاء تطبيقات مرئية وتطبيقات بدون تعليمات برمجية/منخفضة التعليمات البرمجية بشكل أسرع وبثقة. إنها أداة مرنة يمكن من خلالها إنشاء مجموعة واسعة من واجهات المستخدم (تطبيقات الرسم التخطيطي التفاعلي، وأدوات الرسم، وتصورات البيانات، وواجهات المستخدم لأنظمة المراقبة، وغيرها الكثير). يمكن أن تصبح الطبقة الأساسية لطلبك التالي وتساعدك على طرح فكرتك في السوق في أيام، وليس أشهر أو سنوات.

يمكن العثور على مزيد من المعلومات والأمثلة والوثائق على موقع Jointjs.com.

؟ ابدأ بالبرامج التعليمية.

لطرح سؤال أو مشاركة التعليقات أو المشاركة في مناقشة مع أعضاء المجتمع الآخرين، تفضل بزيارة مناقشات GitHub.

المزيد من الأمثلة متاحة على CodePen.

تحقق من وثائق الخريطة الذهنية لدينا.

سمات

• عناصر المخطط الأساسية (المستقيم، الدائرة، القطع الناقص، النص، الصورة، المسار)
• عناصر مخططة جاهزة للاستخدام من المخططات المعروفة (ERD، Org Chart، FSA، UML، PN، DEVS، ...)
• عناصر مخطط مخصصة تعتمد على SVG أو يتم تقديمها برمجيًا
• ربط عناصر المخطط بالروابط أو الروابط بالروابط
• روابط قابلة للتخصيص ورؤوس الأسهم والتسميات الخاصة بها
• أشكال الارتباط القابلة للتكوين (المراسي ونقاط الاتصال والرؤوس وأجهزة التوجيه والموصلات)
• خصائص وبيانات العناصر المخصصة
• استيراد/تصدير من/إلى تنسيق JSON
• منافذ عناصر قابلة للتخصيص (الشكل والموضع، موزعة حول الأشكال أو موضوعة يدويًا)
• واجهة برمجة تطبيقات الرسم البياني الغنية (الاجتياز، dfs، bfs، العثور على الجيران، الأسلاف، العناصر عند النقطة، ...)
• التفاعل الحبيبي
• المخططات الهرمية (الحاويات، العناصر المضمنة، العلاقات بين الوالدين والطفل)
• أدوات العناصر والارتباطات (الأزرار، أيقونات الحالة، أدوات تغيير شكل الروابط،...)
• أدوات التمييز (توفر التركيز البصري على العناصر الخاصة بك)
• التخطيطات التلقائية (ترتيب العناصر والروابط تلقائيًا)
• يعتمد بشكل كبير على الأحداث (الرد على أي حدث يحدث داخل الرسم التخطيطي)
• تكبير/تصغير
• دعم اللمس
• بنية MVC
• على أساس SVG
• ... أكثر من ذلك بكثير

المتصفحات المدعومة

• أحدث إصدار من Google Chrome (بما في ذلك الهاتف المحمول)
• أحدث فايرفوكس
• أحدث إصدار من Safari (بما في ذلك الهاتف المحمول)
• أحدث إصدارات مايكروسوفت إيدج
• أحدث الأوبرا

بيئة التطوير

إذا كنت تريد العمل على JointJS محليًا، استخدم الإرشادات التالية للبدء.

التبعيات

تأكد من تثبيت التبعيات التالية على نظامك:

• Node.js
• نخر CLI
• بوابة
• غزل

تأكد من أنك تستخدم إصدار Yarn >= 2.0.0، حتى تتمكن من الوصول إلى وظائف نطاقات مساحة عمل Yarn. إذا كنت تستخدم Volta، فسوف يقرأ تلقائيًا هذا التقييد من package.json .

يثبت

استنساخ مستودع git هذا:

git clone https://github.com/clientIO/joint.git

انتقل إلى الدليل joint :

 cd joint

تثبيت كافة التبعيات:

yarn install

إنشاء ملفات التوزيع من التعليمات البرمجية المصدر:

yarn run dist

أنت الآن جاهز لتصفح أمثلة التطبيقات الخاصة بنا، والتي تجمع بين الوظائف من حزم JointJS المتعددة:

 cd examples

راجع ملف README.md الخاص بكل تطبيق للحصول على إرشادات إضافية.

يمكنك أيضًا تصفح التطبيقات التجريبية لحزمة JointJS Core الخاصة بنا:

 cd packages/joint-core/demo

يمكن تشغيل معظم العروض التوضيحية بمجرد فتح ملف index.html في متصفحك. تحتوي بعض العروض التوضيحية على تعليمات إضافية، والتي يمكنك العثور عليها في ملفات README.md الخاصة بها.

الاختبارات

لتشغيل كافة الاختبارات:

yarn run test

لتشغيل الاختبارات من جانب الخادم فقط:

yarn run test-server

لتشغيل الاختبارات من جانب العميل فقط:

yarn run test-client

لتشغيل اختبارات TypeScript فقط:

yarn run test-ts

لينت

للتحقق من أخطاء الفحص في src types الدلائل:

yarn run lint

لإصلاح الأخطاء تلقائيًا، قم بتشغيل eslint لـ src types الدلائل:

yarn run lint-fix

تقارير تغطية الكود

لإخراج تقرير تغطية التعليمات البرمجية بتنسيق HTML:

yarn run test-coverage

لإخراج تقرير تغطية الكود بتنسيق lcov:

yarn run test-coverage-lcov

سيتم حفظ مخرجات جميع اختبارات الوحدة في دليل packages/joint-core/coverage .

المساهمين

رخصة

مكتبة JointJS مرخصة بموجب ترخيص Mozilla العام 2.0.

حقوق الطبع والنشر © 2013-2024 العميل IO