#خيارات الرسم البياني

تتيح لك هذه الخيارات تحديد كيفية عرض الرسوم البيانية. وهي تدعم وضعين: الأساسي (الرسومي) والمخصص (باستخدام JavaScript). الوضع الأساسي مثالي للربط السريع والخصائص الشائعة، أما الوضع المخصص فيناسب السيناريوهات المعقدة والتخصيص المتقدم.

#هيكل اللوحة

نصيحة: لتسهيل عملية التكوين، يمكنك طي اللوحات الأخرى أولاً.

شريط الإجراءات العلوي اختيار الوضع:

• Basic: تكوين رسومي. اختر نوعًا وأكمل ربط الحقول؛ اضبط الخصائص الشائعة مباشرةً عبر المفاتيح.
• Custom: اكتب JavaScript في المحرر وأرجع كائن ECharts option.

#الوضع الأساسي

#اختيار نوع الرسم البياني

• الأنواع المدعومة: الرسم البياني الخطي، رسم بياني للمساحة، الرسم البياني العمودي، الرسم البياني الشريطي، الرسم البياني الدائري، الرسم البياني الدائري المجوف، الرسم البياني القمعي، الرسم البياني المبعثر، وغيرها.
• تختلف الحقول المطلوبة حسب نوع الرسم البياني. تأكد أولاً من أسماء الأعمدة وأنواعها في "استعلام البيانات ← عرض البيانات".

#ربط الحقول

• الرسم البياني الخطي/المساحة/العمودي/الشريطي:
  • xField: البعد (مثل التاريخ، الفئة، المنطقة)
  • yField: المقياس (القيمة الرقمية المجمعة)
  • seriesField (اختياري): تجميع السلسلة (لخطوط متعددة/مجموعات أعمدة متعددة)
• الرسم البياني الدائري/الدائري المجوف:
  • Category: بعد الفئة
  • Value: المقياس
• الرسم البياني القمعي:
  • Category: المرحلة/الفئة
  • Value: القيمة (عادةً ما تكون عددًا أو نسبة مئوية)
• الرسم البياني المبعثر:
  • xField، yField: مقياسان أو بعدان للمحاور

لمزيد من خيارات الرسم البياني، ارجع إلى وثائق ECharts: المحاور و الأمثلة

ملاحظات:

• بعد تغيير الأبعاد أو المقاييس، أعد التحقق من الربط لتجنب الرسوم البيانية الفارغة أو غير المتطابقة.
• يجب أن توفر الرسوم البيانية الدائرية/الدائرية المجوفة والقمعية تركيبة "فئة + قيمة".

#الخصائص الشائعة

• التراص، التنعيم (الرسم البياني الخطي/المساحة)
• عرض التسميات، تلميح الأدوات (tooltip)، وسيلة الإيضاح (legend)
• دوران تسميات المحاور، خطوط التقسيم
• نصف قطر الرسم البياني الدائري/الدائري المجوف ونصف القطر الداخلي، ترتيب الرسم البياني القمعي

توصيات:

• استخدم الرسم البياني الخطي/المساحة للسلاسل الزمنية مع تنعيم معتدل؛ استخدم الرسم البياني العمودي/الشريطي لمقارنة الفئات الكبيرة.
• عند كثافة البيانات، تجنب عرض جميع التسميات لمنع التداخل.

#الوضع المخصص

يُستخدم لإرجاع كائن ECharts option كامل، وهو مناسب للتخصيص المتقدم مثل دمج سلاسل متعددة، وتلميحات أدوات معقدة، والأنماط الديناميكية. الاستخدام الموصى به: توحيد البيانات في dataset.source. لمزيد من التفاصيل، راجع وثائق ECharts: مجموعة البيانات (Dataset)

#سياق البيانات

• ctx.data.objects: مصفوفة كائنات (كل صف كسجل، موصى به)
• ctx.data.rows: مصفوفة ثنائية الأبعاد (مع رأس الجدول)
• ctx.data.columns: مصفوفة ثنائية الأبعاد مجمعة حسب الأعمدة

#مثال: رسم بياني خطي للطلبات الشهرية

return {
  dataset: { source: ctx.data.objects || [] },
  xAxis: { type: 'category' },
  yAxis: {},
  series: [
    {
      type: 'line',
      smooth: true,
      showSymbol: false,
    },
  ],
}

#المعاينة والحفظ

• في الوضع المخصص، بعد الانتهاء من التعديلات، يمكنك النقر على زر "معاينة" على اليمين لتحديث معاينة الرسم البياني.
• في الأسفل، انقر على "حفظ" لتطبيق التكوين وحفظه؛ انقر على "إلغاء" للتراجع عن جميع التعديلات التي أجريتها هذه المرة.