Ticks and grid not scrolling

[juliankigwana]

First let me say I'm very impressed with this plugin, it seems to have all the functionality I need.

I followed your React tutorial and the chart it produces does not have scrolling ticks or background grid lines. They only seem to update on the refresh interval, which results in the tick timestamps being updated in place. I have included a gif to help describe the issue as I my terminology might be off.

This is what I expect to see:

I tried removing the tick rotation, but this didn't make any difference to the scrolling. The tutorial says I should be able to just follow those steps, but there must be something else missing. Any help will be most appreciated. Thanks.

[juliankigwana]

I did some digging around and discovered that PR #6241 was the commit inside of ChartJS that broke this functionality, so this has been broken for over a year now. I did try to fix it but I am not familiar enough with code base nor canvas to be able to get anywhere with it.

Would be good to get some eyes on this issue as using this plugin only works properly on Chartjs => 2.8.0

[marcelwenner]

Did you find a solution? @juliankigwana

[juliankigwana]

Did you find a solution? @juliankigwana

No @nbyx, like I said, I was able to find the commit that caused the failure, but it's way over my expertise to fix it. I am currently trying to decide whether to give up on ChartJS find another library that has the same functionality (although Im struggling to find anything ), or switch use the older version ChartJS before it broke. If you know of any alternative solutions or libraries they would be most welcome.

[flieks]

I am also having this issue. I think reverting to 2 year old version is not an option as i am using lots of chartjs (and react-chart-js) features

[flieks]

If you take a realtime.duration of more then 60 secs. Like 200000 ms, then the ticks & lines move properly to the left. In my case i need a bigger range like 1 hour so kind of works. Although it moves not all vertical lines at the same time, but a few at a time by 1 px and then some others.

[nagix]

Closing as the version 1.9.0 that supports Chart.js 2.9.x and fixes this issue was just released. You can also try the version 2.0.0-beta.2 that supports Chart.js 3.x.

[BenWoodford]

I hate to bump a closed issue, but is there a way to actually get this behaviour to come back? I want my grid lines not to move as it's very jarring