Updating options for a grouped chart makes all of the charts get the same options

Demo: https://codesandbox.io/s/vue-apexcharts-sync-annotation-problem-kz2ff

Steps to reproduce: Click on the Set annotation button

• What is the behavior you expect? The first chart gets an annotation between the first and the second xaxis point, while the second chart gets an annotation between the sixth and the seventh point.

• What is happening instead? Both charts get an annotation between the sixth and the seventh point.

This only happens to grouped charts - if I remove group: "sameGroup", the problem goes away.

[thellimist]

https://codesandbox.io/s/react-basic-example-ky41h @junedchhipa

For the example above your solution works. But, I can’t make it work where the Chart render component does not have idea about how many others are being rendered so each chart needs to call ApexCharts.exec themselves or the caller (in the example case App should call ApexCharts.exec.

Basically I want the sync to work in this kind of a setup. Would appriciate your help.

Thanks

[junedchhipa]

For the time being, I suggest using the exec() method for updating a chart in a grouped charts situation. https://apexcharts.com/docs/methods/#exec