使用Vertical Stackbars绘制数据。但其中一个Stackbars缺少1 bar,如图所示(较低的堆栈,其值最小)。堆栈也不成比例。请注意,45看起来很小,20和20 16(参考最后但只有一个栏)任何快速帮助都将受到高度赞赏。
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 %#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) {
};
);
});
答案 0 :(得分:0)
yaxis: {
min: 0}
问题解决了