2010-04-07 6 views
3

Я использую jquery flot, и я пытаюсь создать сложную гистограмму, но у меня есть некоторые проблемы с синтаксисом ... Я отправлю свой код в конце этого, но я совершенно уверен, что это неправильно. Я получаю уложенную гистограмму, но есть только три столбца ...jquery создает штабелированную гистограмму с флотом?

В основном, вот данные, с которыми я работаю, и что я хочу выполнить ... Первая группа (Фокус-группа 1) на каждая строка - нижняя строка штабеля, вторая группа (Фокус-группа 2) является второй, а третья группа (Фокус-группа 3) является верхней группой. «Ответы» - это то, что я хочу использовать на оси х, первое число в каждом наборе равно х, а второе - у.

Response1, [0, 0], [0,0], [0,9] 
Response2, [1, 5], [1,5], [1,11] 
Response3, [2, 2], [2,0], [2,8] 
Response4, [3, 1], [3,2], [3,6] 
Response5, [4, 0], [4,0], [4,7] 

Я должен также упомянуть, что я не уверен, если стек график является лучшим способом пойти ... Правда, я не очень визуальный человек, и вообще найти диаграммы раздражающих ... Если есть лучший способ представить эти данные, то я так полностью открыт для предложений ...

по существу ...

у меня есть ряд вопросов. Каждый из этих вопросов был представлен трем фокус-группам. Участники фокус-групп выбрали ответ. Я пытаюсь представить счет за ответ в каждой фокус-группе для каждого вопроса. Я думал, что сложный график будет лучшим способом, но опять же, я открыт для других способов сделать это. Единственное, я определенно нужно визуальное представление данных ....

код в использовании:

$(function() { 
    var cssid = "#placeholder"; 
    var data = [ [ [1, 0], [2,0], [3, 2] ], [ [1, 0], [2,0], [3, 6] ], [ [1, 0], [2,0], [3, 8] ], [ [1, 0], [2,0], [3, 5] ], [ [1, 0], [2,0], [3, 5] ], ]; 
    var options = { series: { stack: 0, lines: { show: false, steps: false }, bars: { show: true, barWidth: 0.5 },},}; 
    $.plot($(cssid), data, options); 
}); 

ответ

0

http://www.saltycrane.com/blog/2010/03/jquery-flot-stacked-bar-chart-example/ содержит пример кода для столбчатой ​​диаграммы:

$(function() { 
var css_id = "#placeholder"; 
var data = [[[1,10], [2,20], [3,30], [4,40],], 
      [[1,30], [2,30], [3,30], [4,30],], 
      [[1,40], [2,30], [3,20], [4,10],],]; 
var options = {series: {stack: 0, 
         lines: { show: false, steps: false }, 
         bars: { show: true, barWidth: 0.9 },},}; 

$.plot($(css_id), data, options); 
}); 

Этот пример не работает для вас?

+0

Это именно то, что я использовал, но я получаю только три столбца и нет меток ... – KittyYoung

+0

Хорошо ... это то же самое ... – KittyYoung

+0

См. мой ответ ниже, как прикреплять ярлыки. –

1

Вы не вводите свои данные правильно. Оно должно быть следующим:

$(function() { 
    var css_id = "#placeholder"; 
    var data = [[[0,0], [1,5], [2,2], [3,1], [4,0]], 
       [[0,0], [1,5], [2,0], [3,2], [4,0]], 
       [[0,9], [1,11], [2,8], [3,6], [4,7]],]; 
    var options = {series: {stack: 0, 
          bars: { show: true, barWidth: 0.5 },}, 
        xaxis: {ticks: [[0, 'Resp1'], [1, 'Resp2'], [2, 'Resp3'], [3, 'Resp4'], [4, 'Resp5']]}, 
        }; 

    $.plot($(css_id), data, options); 
}); 
0

Вы просто прикрепить ярлыки к данным ... о, например так:

graph = $.plot($('div#some_graph'), 
[ 
    {label: 'Work', data: rsp.work}, 
    {label: 'Travel', data: rsp.travel} 
], 
{ 
series: { 
...