Does jquery create a complex histogram with a fleet?

Question

I am using jquery flot and I am trying to create a complex histogram, but I am having some syntax problems ... I will post my code at the end of this, but I am pretty sure this is wrong. I get a complex histogram, but there are only three columns ...

Basically, here is the data I'm working with and what I want to do ... The first group (Focus group 1) in each row is the bottom row of the stack, the second group (Focus group 2) is the second, and the third group (Focus Group 3) is the top group. “Answers” ​​is what I want to use on the X axis, the first number in each set is x, and the second number is y.

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]

I should also mention that I'm not sure that a complex schedule is the best way to go ... Admittedly, I am not a very visual person and usually find schedules annoying ... If there is a better way to present this data, then I am completely open to suggestions ...

Essentially ...

I have a number of questions. Each of these questions was presented to three focus groups. Focus group participants chose the answer. I am trying to present a response score in each focus group for each question. I thought a difficult schedule would be the best way, but then again, I am open to other ways to do this. The only thing I need is a visual representation of the data ....

Used code:

$(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);
});

Answer 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);
});

Answer 2

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);
});

?

Answer 3

You just need to attach labels to the data ... something like this:

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