JqPlot Stack Bar没有显示出来

时间:2014-06-21 18:09:37

标签: jquery jqplot

使用Vertical Stackbars绘制数据。但其中一个Stackbars缺少1 bar,如图所示(较低的堆栈,其值最小)。堆栈也不成比例。请注意,45看起来很小,20和20 16(参考最后但只有一个栏)任何快速帮助都将受到高度赞赏。enter image description here

Html代码与Javascripts一起显示在下面。

<div class="col-sm-10 col-md-10 col-xs-10 col-sm-offset-2 col-md-offset-2 PanelDiv" >
<div class="panel panel-default">
    <div class="panel-heading">File Processing for - Last 7 Days</div>
    <div class="panel-body" >
        <div class="col-sm-12 col-md-12 col-xs-12  " style="height:580px">

            <div id="chart3" style="width:100%; height:100%  "  ></div>



        </div>
    </div>
</div>

JS:

      $(document).ready(function(){

var s11 = [['2014-06-10',100],['2014-06-11',85],['2014-06-12',72],['2014-06-13',64],['2014-06-14',52],['2014-06-15',45],['2014-06-16',40]];
var s12 = [['2014-06-10',10],['2014-06-11',25],['2014-06-12',15],['2014-06-13',30],['2014-06-14',32],['2014-06-15',20],['2014-06-16',50]];
var s13 = [['2014-06-10',12],['2014-06-11',15],['2014-06-12',10],['2014-06-13',20],['2014-06-14',24],['2014-06-15',16],['2014-06-16',30]];

plot3 = $.jqplot('chart3', [s11, s12, s13], {

    stackSeries: true,
    captureRightClick: true,
    seriesDefaults:{
      renderer:$.jqplot.BarRenderer,
      rendererOptions: {
          barMargin: 50,
          highlightMouseDown: true   
        },
        pointLabels: {show: true}
    },
    series:[
        {label: 'File Processed' , color:'#82CCFF'},
        {label: 'File In Progress' , color:'#FFDEAD'},
        {label: 'File Errored' , color:'#FF8F73'}

    ],
    axes: {
      xaxis: {
            renderer: $.jqplot.DateAxisRenderer,
            tickOptions:{
                formatString:'%b&nbsp;%#d'
            },
            tickInterval:'1 day',
            min:'2014-06-09',
            max:'2014-06-17'
        },
        yaxis: {

            padMin: 0
        }
    },
        legend: {
          show: false,
          location: 'e',
          placement: 'outside'
        }      

});

   enter image description here$('#chart3').bind('jqplotDataClick', 
    function (ev, seriesIndex, pointIndex, data) {




    };
); 

});

1 个答案:

答案 0 :(得分:0)

    yaxis: {
     min: 0}

问题解决了