Флот с осью "String" x

При использовании флота я хотел бы иметь строку на основе оси x. Например, у меня есть список клиентов "Боб", "Крис", "Джо" и хотел бы построить свой доход по оси Y. (это гистограмма)

Кажется, что на первый взгляд флот поддерживает только числовые типы по оси x. Это правда?

Ответы

Ответ 1

@Matt близок, но имеет смысл просто использовать параметр ticks, чтобы напрямую указать, какие отметки должны иметь метки:

var options = {

...
  xaxis: {
    ticks: [[0,'Bob'],[1,'Chris'],[2,'Joe']]
  }
...

};

EDIT: это выглядит как this (я добавил больше данных, чем метки, но вы поняли).

Ответ 2

Вы должны сделать это, используя опцию tickFormatter в соответствии с этим вопросом. Я сам не пробовал, но сделаю это:

var xAxisLabels = ['Bob', 'Chris', 'Joe'];    
function xAxisLabelGenerator(x){
    return xAxisLabels[x];
}

var plot = $.plot($("#placeholder"), { 
    // snip other options...
    xaxis: {
       transform: xAxisLabelGenerator,
       tickFormatter: xAxisLabelGenerator 
    }
});

Это означает, что фактические значения x должны быть 0, 1, 2, ...

Ответ 3

Плагин Категории (jquery.flot.categories.js) сделает это довольно красиво, так что данные могут быть отформатированы следующим образом:

var data = [ ["January", 10], ["February", 8], ["March", 4], ["April", 13], ["May", 17], ["June", 9] ];

и запишите вот так: enter image description here

Смотрите: http://www.flotcharts.org/flot/examples/categories/index.html