كيف يمكنني التحكم في حجم علامة التجزئة في التدفق

Question

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

$.plot($("#placeholder"), [
    {
        label: 'Failed',
        data: [[0,10]],
        bars: { show: true }
    },
    {
        label: 'Passed',
        data: [[1,15]],
        bars: { show: true }
    },
    {
        label: 'Not Run',
        data: [[2,30]],
        bars: { show: true }
    },
    {
        label: 'Blocked',
        data: [[3,5]],
        bars: { show: true }
    },
    {
        label: 'In Progress',
        data: [[4,40]],
        bars: { show: true }
    }
],
{
    xaxis: {
        ticks: [[0.5, "Failed"], [1.5, "Passed"], [2.5, "Not Run"], [3.5, "Blocked"], [4.5, "In Progress"]]
    },
    legend: {
        show: false
    }
});

أجد أن الخط المستخدم لقيم التجزئة على المحور x كبير جدًا بعض الشيء، خاصة عندما يتم عرض الرسم البياني بأبعاد صغيرة، على سبيل المثال.240x100.لقد قرأت وثائق واجهة برمجة التطبيقات (API)، ولكن لا يمكنني العثور على كيفية التحكم في أحجام علامات التجزئة.

هل هذا ممكن OOTB؟

Answer 1

ولا يبدو يمكنك ضبط حجم الخط عن طريق API، ولكن يمكنك استخدام المغلق لضبط حجم تسميات التجزئة.

.tickLabel { font-size: 80% }

Answer 2

إليك مثال مباشرة من واجهة برمجة التطبيقات (API):

xaxis:{
   font:{
      size:11,
      style:"italic",
      weight:"bold",
      family:"sans-serif",
      variant:"small-caps"
   }
}

http://flot.googlecode.com/svn/trunk/API.txt

Answer 3

وسوف إجابتين أعلاه لا تعمل على الإصدار الأحدث من FLOT، لأنها لم تعد تستخدم النص "الحقيقية" (ويوجه النص بدلا من ذلك). بدلا من ذلك تحديد هذه الخيارات:

و{xaxis: {font: size: some_number}, yaxis: {font: size: some_number}}

و(استبدال some_number مع الحجم المطلوب في نقطة)

Answer 4

لقد استخدمت ما يلي:

ملف CSS/ملف SCSS

#graph_label .tickLabel{

     font-size: 50%;
  }

Index.html أو المكان الذي تقوم فيه بتخطيط منطقة الرسم البياني

$.plot($("graph_label"), [dataArrayReference], options);

المرجع:إجابة @BrentM أعلاه

ملاحظة:أنا أستخدم إصدار Flot قبل الإصدار 0.8.1 لذا ليس لدي أي فكرة عن كيفية عمل الإصدار الأحدث