Updating chart data dynamically

[RIo]

Hi,

I'm having trouble updating the chart data. Inside the react app I have a useState hook where the chart data is stored. When the user clicks on a series, I want to hide all other series and show only the one he clicked on. Here is the code as I implemented it.

Code: Select all

  const [chartOptions, setChartOptions] = React.useState<Highcharts.Options>({});


 setChartOptions({
     plotOptions: {
          series: {
            label: {
              connectorAllowed: false
            },
            marker: {
              enabled: true
            },
            cursor: 'pointer',
            events: {
              click() {
                const { name } = this;
                const lines = cloneDeep(chartPoints);

                if (!historyEnabled) {
                  lines?.forEach((item) => {
                    if (item.type === 'line' && String(item.name) !== String(name)) {
                      item.visible = false;
                    } else {
                      console.log(name);
                    }
                  });
                } else {
                  lines?.forEach((item) => {
                    if (item.type === 'line') {
                      item.visible = true;
                    }
                  });
                }
                historyEnabled = !historyEnabled;
                if (lines) {
[color=#FF0000]// HERE IS THE PROBLEM. I FILTER THE DATA AND SET UP NEW SERIES, BUT THE TABLE IS NOT UPDATED[/color]
                  const newData = lines.filter((item) => item.visible);
                  setChartOptions({
                    series: newData
                  });
                }
              }
            }
          }
        },
})

[kamil.k]

Hello There!

Thanks for contacting us with your question again.

We already have very similar topics with potential implementations, and I'd like to refer you to them first as we try not to duplicate topics on our support channels. Please take a look:
- https://stackoverflow.com/questions/657 ... -highcarts
- https://stackoverflow.com/questions/660 ... rsal-of-de

Let me know if there's anything unclear to you or if you need any help implementing those solutions,
Kind Regards!