Level 13
The following javascript is used to render the data afterwards in apexcharts. It renders the initial charts. But as soon as I change the date I get the following additional error
Error: attribute transform: Expected number, "translate(NaN, 0)".
let reservations = $wire.$get('reservations')
let desks = $wire.$get('desks')
for (let i = 0; i < reservations.length; i++) {
let morning = reservations[i].morning
let afternoon = reservations[i].afternoon
let dateCompact = reservations[i].dateCompact
let options = {
chart: {
height: 200,
type: "radialBar",
},
series: [(morning / desks) * 100, (afternoon / desks) * 100],
colors: ['#D30E28', '#000000'],
plotOptions: {
radialBar: {
startAngle: -90,
endAngle: 90,
track: {
startAngle: -90,
endAngle: 90,
},
dataLabels: {
name: {
show: true,
fontSize: '13px'
},
value: {
offsetY: -2,
fontSize: '11px',
formatter: function (val) {
return Math.ceil(val * desks) / 100
}
},
}
}
},
labels: ['Vormittag', 'Nachmittag']
};
new ApexCharts(document.querySelector("#chart-" + dateCompact), options).render();
}