flot side by side stack bar

Question

Có thể có một biểu đồ thanh bên cạnh được trộn với một thanh xếp chồng lên nhau bằng cách sử dụng Flot không?

Tương tự như các câu hỏi jqplot đây: jqplot Side by Side Stacked Bar Chart

Cố gắng sử dụng cả hai nhưng chỉ có một bên cạnh chạy và nếu tôi tắt cạnh nhau, thanh xếp chồng lên nhau hoạt động hoàn hảo.

hình ảnh sẽ tương tự như: http://peltiertech.com/Utility/pix/clusterstackchart.png

Mẫu mã tôi đã viết là: http://jsfiddle.net/WAGbt/ (Thảo luận ra các thứ tự: tài sản X và bạn sẽ thấy chúng chuyển)

$(document).ready(function() 
{ 
    DrawChart(); 
}); 

function GenerateSeries(added) 
{ 
    var data = []; 
    var start = 100 + added; 
    var end = 500 + added; 

    for (i = 1; i <= 20; i++) 
    { 
     var d = Math.floor(Math.random() * (end - start + 1) + start); 
     data.push([i, d]); 
     start++; 
     end++; 
    } 

    return data; 
} 

function DrawChart() 
{ 
    var dataa = GenerateSeries(100); 
    var datab = GenerateSeries(100); 
    var datac = GenerateSeries(100); 

    var ds = new Array(); 

    var data = 
    [ 
     { 
      label: "data1", 
      data: dataa, 
      bars: 
      { 
       show: true, 
       barWidth: 0.2, 
       order: 1, 
       lineWidth: 2 
      } 
     }, 
     { 
      label: "data2", 
      data: datab, 
      bars: 
      { 
       show: true, 
       barWidth: 0.2, 
       order: 2, 
       lineWidth: 2 
      } 
     }, 
     { 
      label: "data3", 
      data: datac, 
      bars: 
      { 
       show: true, 
       barWidth: 0.2, 
       order: 3, 
       lineWidth: 2 
      } 
     } 
    ]; 

    var options = { 
     series: { 
      stack: true 
     }, 
     xaxis: { 
     }, 
     grid: { 
      backgroundColor: { colors: ["#FFF", "#FFF"] } 
     } 
    }; 

    var plot = $.plot($("#placeholder"), data, options); 
} 

Answer 1

Thêm bars với các tùy chọn ...

var options = { 
    series: { 
     stack: true 
    }, 
    xaxis: { 
    }, 
    grid: { 
     backgroundColor: { colors: ["#FFF", "#FFF"] } 
    }, 
    bars:{ // show the bars with a width of .4 
     show: true, 
     barWidth: .4 
    } 

}; 

Và xoa bóp dữ liệu sang định dạng này ...

0.123.

var data = [ // all series 

    [ // first series (Q1) 
     [0,100], // pens Q1 N America 
     [0.4,120], // pencils Q1 N America 
     [1,130], // pens Q1 Europe 
     [1.4,140], // pencils Q1 Europe 
     [2,150], // pens Q1 Asia 
     [2.4,200], // pencils Q1 Asia 
    ], 

    [ // second series (Q2) 
     [0,100], 
     [0.4,200], 
     [1,200], 
     [1.4,200], 
     [2,200], 
     [2.4,200], 
    ], 

    [ // third series (Q3) 
     [0,100], 
     [0.4,200], 
     [1,200], 
     [1.4,200], 
     [2,200], 
     [2.4,200], 
    ], 

    [ // fourth series (Q4) 
     [0,100], 
     [0.4,200], 
     [1,200], 
     [1.4,200], 
     [2,200], 
     [2.4,200], 
    ] 

] 

Và nó hoạt động như thế này: http://jsfiddle.net/WAGbt/2/

tôi đã cập nhật khác với nhãn cho series, và trên các trục: http://jsfiddle.net/WAGbt/3/