同一系列中的jqPlot数据彼此重叠

Question

我试图创建一个jqplot图表，我遇到了一个小问题。

我希望把所有2008年的数据为一类，并具有一定的色彩风格，然后做同样为2009年

目前我有这样的输出：

how current chart looks (imgur link)

使用此代码：

$(document).ready(function(){ 
    // For horizontal bar charts, x an y values must will be "flipped" 
    // from their vertical bar counterpart. 
    var plot2 = $.jqplot('tableTest', [ 
     [[10,2008], [12,2008], [11,2008], [13,2008]], 
     [[2,2009], [4,2009], [6,2009], [3,2009],] 
     ], { 
     seriesDefaults: { 
      renderer:$.jqplot.BarRenderer, 
      // Show point labels to the right ('e'ast) of each bar. 
      // edgeTolerance of -15 allows labels flow outside the grid 
      // up to 15 pixels. If they flow out more than that, they 
      // will be hidden. 
      pointLabels: { show: true, location: 'e', edgeTolerance: -15 }, 
      // Rotate the bar shadow as if bar is lit from top right. 
      shadowAngle: 135, 
      // Here's where we tell the chart it is oriented horizontally. 
      rendererOptions: { 
       barDirection: 'horizontal' 
      } 
     }, 
     axes: { 
      yaxis: { 
       renderer: $.jqplot.CategoryAxisRenderer, 

       /*rendererOptions: { 
        groupLabels:['Fruits', 'Vegetables'] 
       }*/ 

      } 
     } 
    }); 
}); 

有没有人有一个想法，我可以分离出酒吧？

预先感谢您

Answer 1

您添加自己的自定义蜱，并略有不同格式的数据。我已经对代码进行了调整jsFiddle：

$(document).ready(function(){ 
    // For horizontal bar charts, x an y values must will be "flipped" 
    // from their vertical bar counterpart. 

    var ticks = ['2008', '2009']; 

    var plot2 = $.jqplot('tableTest', [[10, 2], [12, 3], [11, 6], [13, 3]], { 
     seriesDefaults: { 
      renderer:$.jqplot.BarRenderer, 
      // Show point labels to the right ('e'ast) of each bar. 
      // edgeTolerance of -15 allows labels flow outside the grid 
      // up to 15 pixels. If they flow out more than that, they 
      // will be hidden. 
      pointLabels: { show: true, location: 'e', edgeTolerance: -15 }, 
      // Rotate the bar shadow as if bar is lit from top right. 
      shadowAngle: 135, 
      // Here's where we tell the chart it is oriented horizontally. 
      rendererOptions: { 
       barDirection: 'horizontal' 
      } 
     }, 
     axes: { 
      yaxis: { 
       renderer: $.jqplot.CategoryAxisRenderer, 
       ticks: ticks 
      } 
     } 
    }); 
});