Error when updating series while slice is selected - donut chart

[cvakodobro]

Bug report

Codepen

https://codepen.io/cvakodobro/pen/poNpQNX

To replicate the error just select slice and click randomize button. You will see an error in the console log.

Explanation

• What is the behavior you expect?

No error when updating series while slice is selected.

• What is happening instead?

An error is thrown every time you update the series while a slice is selected. I'm experiencing this issue using vue-apexchart but I've noticed that the same issue happens with JS apexchart.

• What error message are you getting?

Error: <path> attribute d: Expected moveto path command ('M' or 'm'), "null".

[karagog]

I am also seeing this error under similar circumstances (when calling updateOptions() on a chart that has a slice selected). The donut chart appears to be working fine otherwise, but spams the following error:

Error: attribute d: Expected moveto path command ('M' or 'm'), "null".

I'm going to assume I can safely ignore this, because it does appear to be working fine despite the error. But maybe it indicates a bug somewhere in the code?

[Androvski93]

I am using apexchart with Typescript and Angular 12 and I am having the same issue.

[htimran]

I am using ApexChart with React Js, and I am facing this error just with the region change to the UK, and the graph is not showing correctly and throws this error Error: attribute d: Expected moveto path command ('M' or 'm'), "null". Else on other Regions, it is working fine with no errors. Can anyone help me out on this?

[github-actions[bot]]

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.

[daniiprado]

I am using apexchart with Vue 2 and I am having the same issue.

When I resize the browser or collapse the dashboard sidebar the chart lose data and plotted empty

data: () => ({
  chart: {
      series: [0, 0, 0],
      chartOptions: {
        chart: {
          type: 'donut',
        },
        legend: {
          position: 'bottom',
        },
        colors: ['#1ab7ea', '#0084ff', '#39539E'],
        labels: [
          'Label 1',
          'Label 2',
          'Label 3',
        ],
        responsive: [
          {
            breakpoint: 480,
            options: {
              legend: {
                fontSize: '10px',
              },
            },
          },
        ],
      },
    },
}),
mounted() {
    this.api
      .get()
      .then((response) => {
        this.$refs.chart.updateSeries(
            response.data.chart // => [33, 34, 33]
          )
      })
},

[brianlagunas]

This issue has been confirmed! Thanks for reporting it.

[Mangor1no]

Any new progress on this issue?

[yeongbin-jo]

Still have this issue.

apexchart==3.28.3 react-apexcharts==1.3.9

[junedchhipa]

In the original Codepen https://codepen.io/cvakodobro/pen/poNpQNX provided by @cvakodobro, the issue doesn't happen with the latest version 3.33.0

[yeongbin-jo]

The same problem is occurring in the latest version, but I will first review whether it is my own problem, and if it is not my problem, I will post an example code that can reproduce the error.

[1001v]

Same here. Version 3.33.0.

[1001v]

In the original Codepen https://codepen.io/cvakodobro/pen/poNpQNX provided by @cvakodobro, the issue doesn't happen with the latest version 3.33.0

Please select a data-point and you will see the issue.

[gyoogle]

In the original Codepen https://codepen.io/cvakodobro/pen/poNpQNX provided by @cvakodobro, the issue doesn't happen with the latest version 3.33.0

Same here

[Asmodeios]

Still having this issue on "apexcharts": "^3.35.3"

[gbermudezjc]

I'm having this issue using "apexcharts": "^3.33.0" and "vue": "^2.6.12".

[Sabih-KL]

still having issues [ "apexcharts": "^3.36.0", "react-apexcharts": "^1.4.0"]

[karthickprasathmb]

If anyone using next js, adding swcMinify: false in next.config.js makes it work.

Ref: https://github.com/chartjs/Chart.js/issues/10673

[Sabih-KL]

If anyone using next js, adding swcMinify: false in next.config.js makes it work.

Ref: chartjs/Chart.js#10673

thanks!

[SeanParkTiz]

I am using apexchart with Vue 3 / Typescript and I am having the same issue.

[AdinoWayne]

my version "3.33.0" and nuxtjs "2.15.7" This problem still occurs. anyone, please tell me how to fix it?

[Sabih-KL]

my version "3.33.0" and nuxtjs "2.15.7" This problem still occurs. anyone, please tell me how to fix it?

swcMinify: false in next.config.js