I have a apex chart like this:
On computer all is fine. But now I would make it responsive and I tried this code:
var options = {
chart: {
height: 350,
type: 'bar'
},
plotOptions: {
bar: {
horizontal: false,
columnWidth: '80%'
},
},
series: [{
name: 'Umsatz',
data: umsatzSumMonat
}, {
name: 'Ausgaben',
data: ausgabenSumMonat
}],
xaxis: {
categories: ['Jan','Feb', 'März', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dez'],
},
responsive: [{
breakpoint: 1000,
yaxis: {
categories: ['Jan','Feb', 'März', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dez']
},
options: {
plotOptions: {
bar: {
horizontal: true
}
}
}
}]
}
var chart = new ApexCharts( document.querySelector("#myChart"), options );
chart.render();
Result:
But the bars are to small (not high enough). How can I change this?