As I've read in multiple places returning an array in the formatter function of an ApexChart legend should wrap each item in the array in a tspan, however when testing this myself I can't seem to get it working, the legend is rendered as a single span.
My formatter looks like this:
legend: {
formatter: (label, opts) => {
return [label, ":", opts.w.globals.series[opts.seriesIndex]];
}
}
Is there something I'm missing here? Or is there any other way to achieve multiline legend so that it doesn't overlap with the chart?
The codepen above is using the vanilla ApexCharts library, my project us using the Angular one, don't think that changes much seeing how they behave the same.