Flickering effect occurring while disposing series to add new series with new data

[Ashishvkale]

I have multiple line and column series. On some modifications, I need to update the data for those. So first I dispose the old series before adding the new data to new series and when this recreation operation is in process a flickering effect occurs (Old chart vanishes and new comes in) That flicker I don't want.

I dispose like this :

      public disposeSeries(item: string): void {
      const seriesToDispose: any[] = []

          this.chart?.series.each((series) => {
              if (series.get("name") === item) seriesToDispose.push(series)
          })

          seriesToDispose.forEach((series) => {
              this.chart?.series.removeIndex(this.chart.series.indexOf(series)).dispose()
          })
      }

and if I don't dispose the series it creates it duplicates rows with the same data I want it to make smooth data addition not the flickered transition one

Here's the code pen for same: (where I'm disposing and filling data again after timeout) https://codepen.io/ashish-kale-ak/pen/xxormxb?editors=0010

[martynasma]

Setting data on an existing series should not duplicate anything.

I tried removing dispose/create code, and leaving just series.data.setAll(). The data gets updated, nothing is duplicated.

What am I missing?

[Ashishvkale]

Thanks @martynasma It seems my code was accidentally recreating the series instead of just setting the data