search

visjs / vis-timeline

📅 Create a fully customizable, interactive timelines and 2d-graphs with items and ranges.
https://visjs.github.io/vis-timeline/
Other
1.74k stars 302 forks source link

Timeline: Event items jump around as I pan in X #1786

Open ChrisAndersonFV opened 3 months ago

ChrisAndersonFV commented 3 months ago

I have noticed that when I have many event items on a timeline, they are stacked and laid out nicely at first. But as I pan to the right, the items start to jump around. This seems to be due to items getting removed from the DOM (or layout algorithm?) as they go out of "range". This makes sense from a performance standpoint, but it causes knock-on effects to the layout of items such that sometimes an item I am looking at just jumps away, often offscreen, which is jarring.

I would love it if I can modify vis-timeline such that I can have stability of layout during X/Y panning. Of course zooming will cause a re-layout, but it would be awesome if panning did not, if everything just stayed in place.

I have started looking into the code to try and make this change, as I don't see an option for it. But I would super appreciate any tips related to this if anyone has had this issue?

Thanks!!!

devio-at commented 1 month ago

@ChrisAndersonFV I noticed the same phenomenon. The problem seems to arise from Group.redraw() calculating default heights for Timeline entries not currently displayed (especially if group need to display in several lines), After going through the code (and adding lots of logging), setting TimelineOptions.groupHeightMode to 'fixed' solved the issue