Problem with either seriesName or formatter for Multiple Y-Axis Chart

[thebium]

We are using this ng-apexcharts version
[email protected]
Here's a code for problem replication:

this.chart = {
      chart: {
        animations: {
          speed: 400,
          animateGradually: {enabled: false}
        },
        fontFamily: 'inherit',
        foreColor: '#bbb',
        width: '100%',
        height: '100%',
        type: 'line',
        toolbar: {show: false},
        zoom: {enabled: false}
      },
      dataLabels: {enabled: false},
      grid: {
        show: true,
        borderColor: '#334155',
        padding: {
          top: 10,
          bottom: -40,
          left: 0,
          right: 0
        },
        position: 'back',
        xaxis: {
          lines: {show: true}
        }
      },
      title: {
        text: ''
      },
      series:
        [
        {name: 'column',data: [100,200,300,400,500,600,700],type: 'column'},
        {name: 'column',data: [10,20,30,40,50,60,70],type: 'column'},
        {name: 'column',data: [15,2,32,44,64,6,7],type: 'column'},
        {name: 'column',data: [5,9,3,14,15,16,17],type: 'column'},
        {name: 'column',data: [12,13,14,15,50,60,70],type: 'column'}
      ],
      stroke: {width: 1.75, curve: 'smooth'},
      tooltip: {
        followCursor: true,
        theme: 'dark',
        x: {format: 'MMM dd, yyyy'},
        y: {formatter: (value: number): string => `${value}`}
      },
      xaxis: {
        axisBorder: {show: true},
        axisTicks: {show: true},
        crosshairs: {
          stroke: {
            color: '#475569',
            dashArray: 0,
            width: 1
          }
        },
        labels: {
          offsetY: 0,
          style: {colors: '#CBD5E1'}
        },
        tickAmount: 20,
        tooltip: {enabled: false},
        categories: ['2024-04-01','2024-04-02','2024-04-03','2024-04-04','2024-04-05','2024-04-06','2024-04-07'],

      },
      yaxis:
      [
        {
          labels: {
            style: {colors: '#CBD5E1'},
          },
          title: {text: 'column'},
          axisTicks: {show: false},
          axisBorder: {show: false},
          opposite: false,
          forceNiceScale: true,
          show: true,
          seriesName: 'column'
        },
        {
          labels: {
            style: {colors: '#CBD5E1'},
            formatter: (value: number, index: number) => {
              const rawValue = value;

              const hours = Math.floor(rawValue / 3600);
              const remainingMinutes = Math.floor((rawValue % 3600) / 60);
              const seconds = Math.round(rawValue % 60);

              if (isNaN(hours) || isNaN(remainingMinutes) || isNaN(seconds)) {
                return '00:00:00';
              }

              const formattedValue = `${String(hours).padStart(2, '0')}:${String(remainingMinutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;

              return formattedValue;
            },
          },
          title: {text: 'time'},
          axisTicks: {show: false},
          axisBorder: {show: false},
          opposite: true,
          forceNiceScale: true,
          show: true,
          seriesName: 'time'
        },
        {
          labels: {
            style: {colors: '#CBD5E1'},
          },
          title: {text: 'line'},
          axisTicks: {show: false},
          axisBorder: {show: false},
          opposite: false,
          forceNiceScale: true,
          show: true,
          seriesName: 'line'
        },
      ]
    };

While the code for chart initialization is this:
<apx-chart class='w-100' style='display:block;height:450px!important;' [series]="chart.series!" [chart]="chart.chart!" [title]="chart.title!" [xaxis]="chart.xaxis!" [yaxis]="chart.yaxis!" [stroke]="chart.stroke!"></apx-chart>

The issue we are facing is that in this case series no. 3 gets formatted as if it was 'time' seriesName Y-axis element. As you can see from the code the name for all series is 'column', so the formatter should not be applying. I don't know if the issue is with how formatter works, or if apexcharts ignores seriesName parameter for some reason.

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.