Hiện giá trị trong thanh - jQuery âm mưu ngang xếp chồng lên nhau biểu đồ thanh

Question

Tôi muốn hiển thị các giá trị trong thanh trên biểu đồ thanh flot (ngang và xếp chồng lên nhau), một cái gì đó như thế này:

|------------------------------------------- 
|     5     | 1 | 
|------------------------------------------- 
| 
|------------------------------------ 
|   3   |  2  | 
|------------------------------------ 

Tôi thấy điều này post: Show value within bar on flot bar chart Các giá trị chỉ xuất hiện bên trong thanh xếp chồng đầu tiên. Giá trị thứ hai là tổng hiện tại, không phải là giá trị tương ứng của thanh hiện tại, ví dụ:

|------------------------------------------- 
|     5 6    |  | 
|------------------------------------------- 
| 
|------------------------------------ 
|   3 5  |   | 
|------------------------------------ 

Có ai đó biết plugin tốt cho chức năng này không? Ngoài ra, tôi muốn tăng kích thước phông chữ bên trong thanh.

Cảm ơn bạn!

---

Đây mã:

<script language="javascript" type="text/javascript" src="js/flot/jquery.flot.js"></script> 
<script language="javascript" type="text/javascript" src="js/flot/jquery.flot.pie.js"></script> 
<script language="javascript" type="text/javascript" src="js/flot/jquery.flot.stack.js"></script> 
<script language="javascript" type="text/javascript" src="js/flot/jquery.flot.barnumbers.js"></script> 

var data = [ 
     {label: 'Label 1', color:"#80FF80", data: [[1,5], [2,3]]}, 
     {label: 'Label 2', color:"#FF8080", data: [[1,1], [2,2]]} 
]; 

//reverse data for horizontal 
for (series in data){ 
    var s = data[series]; 
    for (i=0;i<s.data.length;i++){ 
      var tmp = s.data[i][0]; 
     s.data[i][0] = s.data[i][1]; 
     s.data[i][1] = tmp;   
    } 
} 

var options = { 
    series: { 
     stack: 0, 
     lines: {show: false, steps: false }, 
     bars: { 
      show: true, 
      barWidth: 0.5, 
      align: 'center', 
      horizontal: true, 
      showNumbers: true 
     }, 
    }, 
    yaxis: {ticks: [[1,'Category 1'], [2,'Category 2']]}, 
}; 

$.plot($("#flot-example-2"), data, options); 

Answer 1

Tôi đã cập nhật kho-barnumbers để hỗ trợ thanh xếp chồng lên nhau, xem cập nhật examples. Nếu bạn cần bất kỳ tính năng nào khác, hãy bắn cho tôi một email hoặc mở một vấn đề, tôi chỉ nhìn thấy câu hỏi này một cách tình cờ.

Answer 2

Dường như flot-barnumbers không hỗ trợ biểu đồ thanh xếp chồng. Đó là lý do tại sao giá trị được dán nhãn không đúng cách. Tôi muốn khuyên bạn nên sử dụng jqBarGraph, đó là jQuery plugin để thực hiện xếp chồng các biểu đồ thanh.

http://workshop.rs/jqbargraph/

Tôi hy vọng điều đó sẽ hữu ích.

Answer 3

Cuối cùng tôi đã quyết định sử dụng Highcharts Plugin vì tài liệu được viết tốt hơn nhiều và hoạt động tốt!