Is it possible to add the previous data without the chart going to the beginning?

[paulodfavero]

It's me again LOL
I need to keep the chart on the same place after load more past data.
This video shows the chart going to begin. I need to keep it in the same place.
https://github.com/user-attachments/assets/aca843e5-fde6-4774-ac33-fb4f44fd3b04

Thanks

[martynasma]

Would you be able to post your whole chart and data on CodePen/jsFiddle so that we can test?

[paulodfavero]

CodePen/jsFiddle

https://codepen.io/Paulo-Favero/pen/RNwbeGK
I'm updating the chart with setTimeout only to simulate the behavior.

As you can see, the chart goes to begin. My intention is to keep at the same place when timeout ends and load more data.

[martynasma]

Thanks. I'm still not sure what's the issue.

I load your chart, zoom in, the data updates, but the zoom stays at the place I zoomed to.

[paulodfavero]

Thanks. I'm still not sure what's the issue.

I load your chart, zoom in, the data updates, but the zoom stays at the place I zoomed to.

The first load begin 11:46. After more data the chart goes to 11:00. I need to keep at 11:46 after more data loaded.

[martynasma]

OK, so the axis tries to retain the same position, even if the underlying data scope changes.

If you need to keep exact same date scope across updates, you can follow this workflow:

1. Before data update, log selectionMin and selectionMax of the X-axis.
2. Updated data
3. Once data is loaded, use axis' zoomToValues() to zoom it to same scope.

setTimeout(() => {
  var from = dateAxis.getPrivate("selectionMin");
  var to = dateAxis.getPrivate("selectionMax");
  const aggregatedTicksRef = [...oldDataAggregated, ...dataAggregated]
  valueSeries.data.setAll(aggregatedTicksRef);
  valueSeries.events.once("datavalidated", function(ev) {
    dateAxis.zoomToValues(from, to);
  })
},5000)

[paulodfavero]

It works, but once data is loaded - after 5 seconds - the chart shakes.
Do I have to improve something in my code to avoid this shake behavior?
https://github.com/user-attachments/assets/dbbb1907-3032-4e05-a2ca-b639ea3ffe4c

[martynasma]

If you do not need the animation, you can disable it by passing 0 to zoom function:

dateAxis.zoomToValues(from, to, 0);

[paulodfavero]

If you do not need the animation, you can disable it by passing 0 to zoom function:

dateAxis.zoomToValues(from, to, 0);

Keeps blinking. But now is more faster.
I'm sorry
https://github.com/user-attachments/assets/6ea680a7-1963-4c5f-bcf8-c14a1381b2e5

You can see on https://codepen.io/Paulo-Favero/pen/RNwbeGK

[paulodfavero]

@martynasma
What if I push new more data on the valueSeries.data instead of setAll?
I think that setAll clear all data and after includes new data. Maybe this is blinking behavior.