I am trying to build a bar chart where 1st series represent the revenue and the next three represent different kind of expenses. So 1st series to be a single bar and the rest three series as stacked bar. Here is my code for the same.
var s0 = [15, 17, 19, 21];
var s1 = [2, 6, 7, 10];
var s2 = [7, 5, 3, 4];
var s3 = [14, 9, 3, 8];
var ticks = ['May', 'June', 'July', 'August'];
var plot3 = $.jqplot('chart1', [s0, s1, s2, s3], {
stackSeries: true,
animate: true,
seriesDefaults: {
renderer: $.jqplot.BarRenderer,
pointLabels: {
show: true,
},
rendererOptions: {
fillToZero: true,
barMargin: 30,
barWidth: 50,
barPadding: 5,
barDirection: 'vertical'
},
},
series: [
{
disableStack: true,
label: 'Revenue'
},
{label: 'Expense1'}, {label: 'Expense2'}, {label: 'Expense3'}
],
axesDefaults: {
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
tickOptions: {
fontSize: '13pt'
}
},
axes: {
xaxis: {
renderer: $.jqplot.CategoryAxisRenderer,
ticks: ticks
},
yaxis: {
}
},
legend: {
show: true,
location: 'e',
placement: 'outside'
}
});
I have addded disableStack: true
for the first series to exclude it from the stack but the chart still considers it as a part of the stack. Here is the output of my code.
Is there a way to fix this ? Thanks.