Scroll problem with onTimeChange - Limiting visible range view

[Hugofv]

I have a problem that I want to limite visible range view using the follow code:

` const onTimeChange = ( visibleTimeStart, visibleTimeEnd, updateScrollCanvas ) => { const minDate = filter.startDate.clone().startOf("day").valueOf(); const maxDate = filter.endDate.clone().endOf("day").valueOf();

if (visibleTimeStart < minDate && visibleTimeEnd > maxDate) {
  updateScrollCanvas(minDate, maxDate);
} else if (visibleTimeStart < minDate) {
  updateScrollCanvas(
    minDate,
    minDate + (visibleTimeEnd - visibleTimeStart)
  );
} else if (visibleTimeEnd > maxDate) {
  updateScrollCanvas(
    maxDate - (visibleTimeEnd - visibleTimeStart),
    maxDate
  );
} else {
  updateScrollCanvas(visibleTimeStart, visibleTimeEnd);
}

}; `

The results is bellow:

• Left side - The Header keep fixed when the body is scrolling

• Right side - The body finish before the header

Anyone to help in this bug. I suggest pass the start and end datetime to limite the range view.

[julhernandezv]

Any workaround?, I have the same issue

[rezgar]

Here's a workaround based on the internal calculations:

onTimeChange={(visibleTimeStart, visibleTimeEnd, updateScrollCanvas) => {
    let zoom = visibleTimeEnd - visibleTimeStart; // buffer - 1 (1 is visible area) divided by 2 (2 is the buffer split on the right and left of the timeline)

    const minTimeAdjusted = minTime + zoom * (buffer - 1) / 2; // Hack to prevent scroll past the minTime
    const maxTimeAdjusted = maxTime - zoom * (buffer - 1) / 2; // Hack to prevent scroll past the maxTime

     if (visibleTimeStart < minTimeAdjusted && visibleTimeEnd > maxTimeAdjusted) {
         updateScrollCanvas(minTimeAdjusted, maxTimeAdjusted, true)
     } else if (visibleTimeStart < minTimeAdjusted) {
         updateScrollCanvas(minTimeAdjusted, minTimeAdjusted + zoom, true)
     } else if (visibleTimeEnd > maxTimeAdjusted) {
         updateScrollCanvas(maxTimeAdjusted - zoom, maxTimeAdjusted, true)
     } else {
         updateScrollCanvas(visibleTimeStart, visibleTimeEnd)
     }
}}

[drugoi]

Hey, @rezgar, what is the buffer in your workaround?

[matbiernat]

Well, how about fixed header then? @rezgar answer resolves the body issue but header is still not moving at all.