Multiple-yaxis-scales , 3 series with 2 scales demo broken in 3.47.0 (JS)

[LeoMcH36]

Description

Any multi axis chart that has multiple yaxis with the same seriesName cause it to crash instead of showing like the 2nd demo at https://apexcharts.com/docs/chart-types/multiple-yaxis-scales/, even this demo doesnt work using 3.47.0, works fine in 3.46.0

Steps to Reproduce

1. Create a multi axis chart, e.g the second example at https://apexcharts.com/docs/chart-types/multiple-yaxis-scales/
2. use [email protected]
3. have multiple elements in yaxis option with the same seriesName e.g "Column A" appears twice in the demo

Expected Behavior

Chart with multiple series sharing singular y-axis on left hand side displays like the demo

Actual Behavior

chart does not display, bar the labels at the bottom, crashes with error " Cannot read properties of undefined (reading 'result')"

Screenshots

error

using [email protected]

using [email protected]

Reproduction Link

https://codepen.io/rogueDovah/pen/eYozBLE

[aboscolo77]

Same here.

In the meantime I solved this by blocking to the previous version

<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>

[rosco54]

Compatibility with existing charts needs to be fixed and I will look at this.

The solution is to use seriesName with an array (as of 3.47.0). Eg, to fix the demo, replace the existing yaxis array (three axes) with the following (two axes):

yaxis: [
{
seriesName: ['Column A', 'Column B'],
axisTicks: {
show: true
},
axisBorder: {
show: true,
},
title: {
text: "Columns"
}
}, {
opposite: true,
seriesName: 'Line C',
axisTicks: {
show: true
},
axisBorder: {
show: true,
},
title: {
text: "Line"
}
}
],

With this, 3.47.0 will work, and you will also see that collapsing Column A no longer causes it's Y axis to hide prematurely while Column B is still visible.

The documentation and the demo needs to be updated.

Briefly: if you want two axes just define two axes, not three with one not shown. Then use seriesName: [] to reference all the series' that will reference each axis. You can still use seriesName with a string to reference one series, and/or let ApexCharts distribute [remaining unreferenced] series. As a default, if you don't use seriesName for any yaxis, it will distribute each series to each yaxis one for one, with any left over series referenced to the last yaxis.

[LeoMcH36]

Thanks, This approach also seems to have fixed the huge performance drop when toggling legends on this type of chart