Как я могу контролировать размер метки тика в flot

У меня есть базовая гистограмма, которую я представляю в flot (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, немного слишком большим, особенно когда график отображается при малых размерах ie. 240х100. Я читал документацию по API, но не могу найти, как управлять размерами меток тиков.

Возможно ли это ООТБ?

4 9
graphing

4 ответа:

Не похоже, что вы можете установить размер шрифта через API, но вы можете использовать css для установки размера меток тиков.

.tickLabel { font-size: 80% }
18

Вот пример непосредственно из API: 

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

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

10

Вышеприведенные два ответа не будут работать на последней версии flot, так как они больше не используют "реальный" текст (вместо него рисуется текст). Вместо этого укажите следующие параметры:

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

(заменить some_number на нужный размер в пунктах)

6

Я использовал следующее:

CSS-файл / SCSS-файл 

#graph_label .tickLabel{

     font-size: 50%;
  }

Индекс.html или место, где вы строите область графика 

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

Ref: ответ @BrentM выше

PS: я использую версию Flot до 0.8.1, поэтому у меня нет никаких идей о том, как будет работать последняя версия

1