highchart stacked bar chat add series dynamically - highcharts

Question

below is my code for the stacked bar chart, It sets the values Y-axis wise instead of X-axis wise, data [5,3] should be shown in x-axis in one row and [2,2] in another x-axis point, but plotting [5,3] and [2,2]
function barChartObject() {
return jQuery.extend(true, {}, Highcharts.setOptions({
chart: {
type: 'bar',
marginTop: 10,
marginBottom: 10,
marginLeft: 50,
marginRight: 2,
width: 500
},
xAxis: {
categories: ['Apples', 'Bananas']
},
yAxis: {
min: 0,
},
legend: {
reversed: true
},
plotOptions: {
bar: {
dataLabels: {
enabled: true
}
},
series: {
stacking: 'normal'
}
}
}));
}
function addBarSeries(chart, chartData) {
_.each(chart.series, function(s) {
s.remove();
});
chart.options.legend.enabled = false;
var series = [{
name: 'John',
data: [5, 3]
}, {
name: 'Jane',
data: [2, 2]
}];
_.each(series, function(s) {
chart.addSeries(s, false);
});
chart.redraw();
}

Answer 1

data [5,3] should be shown in x-axis in
one row and [2,2] in another x-axis point, but plotting [5,3] and
[2,2]
Nope, it renders as it should be. Notice that your series has defined two points, like [{x: 0, y: 2}, {x: 1, y: 2}], which are clearly visible on the chart.
If you want to have those two values in one row of the xAxis, you will need to change your data into this format:
series: [{
name: 'John',
data: [2, 3]
}, {
name: 'Jane',
data: [2, 5]
}]
Demo: https://jsfiddle.net/BlackLabel/2d3u157o/