Keeping the zoom level after updating the data

[SWi98]

I want to create a candlestick chart in React with data being updated a few times every second. The problem starts when I navigate the chart and then the update fires. What happens is, the chart gets completely rerendered and the current zoom level is reset to the default value. With updates being conducted a few times every second navigating gets pretty much impossible. Is it possible to update the chart with new data, but keep the current zoom level?

[AMATEURTOSS]

i have same question do you have solution??

[icefee]

share my solution.

const range = React.useRef(null)
const needSetZoom = React.useRef(false)

React.useEffect(() => {
   if (range.current) {
       needSetZoom.current = true;
    }
}, [data]) // data changed

const chartOption = {
   chart: {
      events: {
          zoomed: function (_chartContext, { xaxis }) {
             range.current = xaxis;
          },
          scrolled: function (_chartContext, { xaxis }) {
              range.current = xaxis;
          },
          updated: function (context) {
              if (needSetZoom.current) {
                   const { min, max } = range.current;
                   context.zoomX(min, max);
                   needSetZoom.current = false;
               }
          }
      }
   }
}