Documentation menu

عنصر المخطط الدائري / الحلقي

قيمة واحدة لكل فئة، تُعرض حصةً من كلٍّ — دائرة، أو في الوضع الحلقي حلقة تتّسع لرقم رئيسي في منتصفها.

آلية العمل

يُعرض المخطط كصورة PNG واحدة يولّدها الخادم (دون مكتبة مخططات تعمل في المتصفح، ودون JavaScript) مع مفتاح مخطط مرئي دائمًا وجدول بيانات HTML أسفلها — وهو الاقتران نفسه غير القابل للتفاوض الذي يلتزم به كل مخطط في هذه المجموعة. وعلى خلاف مفتاح المخطط الشريطي/الخطي، يظهر مفتاح المخطط الدائري دائمًا بغضّ النظر عن عدد الشرائح. فعنوان المخطط الدائري لا يستطيع تسمية شريحة بعينها كما تستعير السلسلة المنفردة في المخطط الشريطي/الخطي عنوان العنصر، ولذلك يحتاج حتى المخطط الدائري ذو الشريحة الواحدة إلى مفتاحه ليقول ما هي تلك الشريحة.

يعرض كل عنصر في مفتاح المخطط تسمية الشريحة إلى جانب نسبتها المئوية من الإجمالي. ويضيف جدول البيانات عمودًا ثالثًا (القيمة الدقيقة، إلى جانب الفئة والنسبة المئوية)، فتتوفّر دائمًا نصًّا كلٌّ من الحصة المقرّبة للقراءة السريعة والرقم الدقيق.

يختلف شكل الكتابة عن خانات السلاسل الثابتة في المخطط الشريطي/الخطي: صف واحد لكل فئة، لكل منها قيمة واحدة وتجاوز اختياري لـاللون لكل شريحة. لا توجد سلسلة ثانية أو ثالثة، لأن للمخطط الدائري بطبيعته مقياسًا واحدًا بالضبط لكل فئة. وتُتخطّى الصفوف ذات الفئة الفارغة أو القيمة الصفرية/السالبة بالكامل بدلًا من رسمها شريحةً فارغة.

بعد 8 شرائح، تُدمج أصغرها معًا في شريحة اصطناعية واحدة باسم «أخرى»، بدلًا من أن يصبح المخطط رفيعًا إلى حدّ يتعذّر قراءته. فبعد نحو 8 شرائح، يعجز المخطط الدائري عن إظهار كل شريحة بزاوية يمكن تمييزها، ولذا يُبقي الدمج كل شريحة مرسومة مقروءة. يحتفظ الدمج بأكبر 7 شرائح من حيث القيمة ويجمع كل ما عداها في «أخرى». ويعكس كل من مفتاح المخطط وجدول البيانات الدمج نفسه، فيطابق ما تقرؤه بجانب المخطط دائمًا ما هو مرسوم فيه فعلًا. فلا شيء يُخفى بصمت من مفتاح المخطط بينما يُحتسب في الصورة، أو العكس.

الوضع الحلقي يحوّل المخطط الدائري إلى حلقة. وعندها فقط يصبح لحقلي القيمة المركزية والتسمية المركزية أثر، فيمنحانك رقمًا على طريقة مؤشرات الأداء في منتصف الحلقة. وهما زوج تكتبه بنفسك، لا يُشتق من قيم الشرائح — وفق سابقة «يُكتب ولا يُستنتج» نفسها المتّبعة في اتجاه الفرق Δ في بطاقة مؤشرات الأداء. فالمخطط الدائري المصمت لا فراغ فيه لوضع نص، لذا يبقى هذان الحقلان بلا أثر ببساطة حتى تفعيل الوضع الحلقي.

الحقول القابلة للضبط:

  • عنوان المخطط — يظهر فوق الصورة.
  • مفتاح تبديل الوضع الحلقي (مركز مجوّف).
  • البيانات — قائمة الصفوف (الفئة + القيمة + لون اختياري).
  • القيمة المركزية / التسمية المركزية — للوضع الحلقي فقط.
  • لون الخلفية، والحشو، والحدّ، واستدارة الزوايا للبطاقة.
  • أزواج مستقلة من اللون/حجم الخط للعنوان ولنص مفتاح المخطط/الجدول.

يمكن للمخطط الدائري أيضًا ربط شرائحه بمصدر بيانات متصل بدلًا من كتابة الصفوف — حقل التجميع حسب (تصبح كل قيمة مميّزة شريحةً) إضافة إلى حقل قيمة واحد ودالة تجميع (المجموع، أو المتوسط، أو العدد، أو آخر صف). ويمكن لعامل تصفية اختياري الإشارة إلى وسوم الدمج الخاصة بالمستلم لعرض شريحة خاصة بكل مستلم من المصدر نفسه. راجع ربط المخططات ببيانات حقيقية لمعرفة التفاصيل الكاملة، بما في ذلك وضع نتائج ردود الحملة — لرسم توزيع الأصوات في استطلاع أو تقييم سابق مباشرة، على سبيل المثال.

أمثلة

Subject

Where your traffic is coming from

يمكن لتقرير ما بعد الحملة أن يعرض توزيع أصوات استطلاع في مخطط دائري بالربط مباشرة بنتائج ردود تلك الحملة — دون حاجة إلى مصدر بيانات، يكفي اختيار الاستطلاع من المنتقي — فيعكس التقرير دائمًا الحصيلة الحالية للاستطلاع. وقد يستخدم ملخّص نشاط قائم على الاشتراكات مخططًا حلقيًا لـ«توزيع الباقات» (Free/Starter/Pro/Business كشرائح) يعرض مركزه إجمالي الحسابات النشطة رقمًا على طريقة مؤشرات الأداء داخل الحلقة نفسها. ويعتمد ملخّص دعم فيه اثنتا عشرة فئة من التذاكر على الدمج التلقائي في «أخرى» لإبقاء المخطط مقروءًا، واثقًا بأن جدول البيانات أسفله سيظل يسرد كل فئة منفردة بعددها الدقيق.

كيف يبدو البديل الثابت

<div style="margin:12px 0;padding:16px;background-color:#ffffff;border-radius:8px">
  <p style="margin:0 0 8px;font-weight:600;font-size:15px;color:#111827">Plan mix</p>
  <img src="https://mailinapp.com/api/analytics/chart?d=eyJ0eXBlIjoi...&s=3f9a2b1c..." width="320" height="320"
       alt="Donut chart: Free 420 (52%), Starter 210 (26%), Pro 175 (22%)"
       style="display:block;max-width:100%;height:auto;margin:8px 0" />
  <div style="display:flex;flex-wrap:wrap;gap:12px;margin:0 0 6px">
    <span style="font-size:12px;color:#6b7280">
      <span aria-hidden="true" style="display:inline-block;width:10px;height:10px;background-color:#4f46e5"></span>
      Free (52%)
    </span>
  </div>
  <table style="width:100%;border-collapse:collapse;margin-top:4px">
    <tr>
      <th style="text-align:left;padding:4px 8px;font-weight:600;font-size:12px;color:#6b7280">Category</th>
      <th style="text-align:left;padding:4px 8px;font-weight:600;font-size:12px;color:#6b7280">Value</th>
      <th style="text-align:left;padding:4px 8px;font-weight:600;font-size:12px;color:#6b7280">Percent</th>
    </tr>
    <tr>
      <td style="text-align:left;padding:4px 8px;font-size:12px;color:#6b7280">Free</td>
      <td style="text-align:left;padding:4px 8px;font-size:12px;color:#6b7280">420</td>
      <td style="text-align:left;padding:4px 8px;font-size:12px;color:#6b7280">52%</td>
    </tr>
  </table>
</div>

يحمل كل من مفتاح المخطط والجدول التسمية/القيمة/النسبة المئوية نفسها بالضبط لكل شريحة — في تكرار مقصود، لأن مفتاح المخطط للمسح السريع والجدول هو المصدر الدقيق.

انظر أيضًا