Bars moving out x-axis - stacked-chart

Question

enter image description hereenter image description hereAm using Echarts on this project .Everything works fine but my stacked bar charts arent working as expected after a scale rendering which increases the x-axis scale .The bars move out of the x-axis as indicated on the screenshot.
here is my code down here
$scope.$watch(attrs.eData, function (newValue, oldValue, scope) {
var legend = [],
sData = [],
data = newValue,
chartName = '';
series = newValue;
var totalSubtitle = 0;
angular.forEach(data, function (val) {
legend.push(val.name);
});
option = {
name: seriesName,
title: {
text: '',
subtext: totalSubtitle,
x: 'center'
},
tooltip: {
trigger: 'item',
axisPointer: {
type: 'shadow'
}
},
xAxis: {
type: 'value',
min: 0,
axisTick: {
show: true
},
axisTick: {
alignWithLabel: false
}
},
yAxis: {
type: 'category',
scale: true,
data: [seriesName],
max: 100,
min: 100,
axisTick: {
show: false
}
},
legend: {
orient: 'horizontal',
bottom: -29,
order: true,
data: legend
},
series: series
};
myChart.setOption(option);
}, true);
$scope.$watch(attrs.eOptions, function (newValue, oldValue) {
option.title.text = newValue.title.text;
option.title.subtext = newValue.title.subtext;
angular.forEach(newValue.series, function (val) {
seriesName = val.name;
});
myChart.setOption(option);
}, true);
myChart.on('click', function (params) {
$scope.SliceSelected(params);
});
$window.onresize = function () {
myChart.resize();
};
}
};

Answer 1

I got some points from your code this may help you out in this issue.
xAxis: {
type: 'value',
min: 0,
axisTick: {
show: true
},
axisTick: {
alignWithLabel: false
}
}
In the above mentioned code axisTick repeated two times
And change the "xAxis" type to "category" and "yAxis" type to "value".
Hope this will fix your issues