6

You will find answer in this post

I am new with react I used apexcharts which worked really fine but whenI had to use this chart components, in other components too, in the same project. Thats where i got a problem in a chart. Suddenly 1 of my chart started to not update any more when series change. I spent a week to figure it out that what was wrong and thought may be i could share it here so some body could find this fix earlier.

So what I found are 2 things;

  1. react-apexcharts is just a wrapper of apexcharts and each chart should have a unique chart id which you define in options. So if you want to use your component in multiple places it would be a good idea to receive chart ID in props and set it like,
...
this.state = {
      options:  {
        chart: {
          id: props.chartId,
...
  1. We can invoke a method to render the chart or override the series array of chart by using global apexcharts methods in your componentDidMount() or UseEffect() like,
import apexchart from "apexcharts";
...
  componentDidUpdate(){
    const {chartId, seriesData} = this.props;
    //here it overrides the chart series with seriesData from props
    apexchart.exec(chartId,'updateSeries', seriesData);
  };
...

There are other plenty of useful methods that can we use from apexcharts as mentioned in the documentation here: https://apexcharts.com/docs/methods/

I hope some body find it helpful.

Thank you.

General Grievance
  • 4,555
  • 31
  • 31
  • 45
GameChanger
  • 378
  • 5
  • 16
  • Thanks for posting this information you have found on SO! In the future, might I suggest you follow the [prescribed procedure for self-answering a question](https://stackoverflow.com/help/self-answer) in order to maintain the SO format conventions? Thanks, and happy coding! – Alexander Nied Oct 08 '21 at 16:01
  • 1
    While this might be good information, Stack Overflow has a strict separation between questions and answers. Questions must actually ask a question, while answers must actually attempt to answer the question on which they are posted. If you want this on Stack Overflow, then you need to rewrite this such that what is in the question is a question to which the code you have here is an answer. You can then post this code as an answer on that question. Asking and answering your own questions is fine, as long as the question is on-topic and has enough information such that anyone could answer it. – Makyen Oct 09 '21 at 00:49

0 Answers0