MaTeMaTuK / gantt-task-react

Gantt chart for React with Typescript
MIT License
847 stars 471 forks source link

Horizontal Scrollbar doesn't scroll fully to the left #231

Open za-6174 opened 6 months ago

za-6174 commented 6 months ago

Hi @MaTeMaTuK,

Thanks for this library. I am using it for my react project but I am encountering some issues related to horizontal scrolling. When I scroll to the left quickly, sometimes the horizontal scroll bar doesn't scroll fully to the left. It looks bad because it seems it cuts the timeline tasks and looks like there is more to scroll but it doesn't let me scroll. Please have a look on the video below and spot the issue in the end part of the video. Would be much appreciated if you could solve this issue 👍Thanks!

https://github.com/MaTeMaTuK/gantt-task-react/assets/66186092/0ec23a80-0424-4086-9b80-b2abd9d57270

Picture1

fredbabe commented 6 months ago

Hey man

To fix it, you'll need to download the repository and integrate it directly into your project. Specifically, within gantt.tsx at line 328, there's a function designed to manage horizontal scrolling. For some reason, this function includes a condition to determine whether it should ignore certain scroll actions. This check is triggered each time scrolling stops, leading to the last scroll movement not being registered. This behavior is causing the bug you mentioned. Disabling this check seems to resolve the issue for me. However, I'm unsure of the purpose of this check, so I cannot say if this change might introduce new bugs. As of now, it appears to be working correctly in my case.

The functin could look like this after the fix: if (scrollX !== event.currentTarget.scrollLeft) { setScrollX(event.currentTarget.scrollLeft); setIgnoreScrollEvent(true); } else { setIgnoreScrollEvent(false); }

isleyva commented 6 months ago

hello @fredbabe im having an issue related with the scoll in both x-axis and y-axis, im experimenting multiples rerenders while scroll is being used. did you know something about this.

thanks a lot ;)