Our pure JavaScript Scheduler component


Post by dennisli »

Hi,

I am running into an issue where the initialschedule.zoomIn() would result in a blank schedule without any events drawn/rendered and no timeline. But pressing zoomIn a second time will render. There are also other sequences of zoomToFit, zoomOut etc that'll result in this behavior.

Steps to reproduce:

1. schedule.zoomToFit()
2. schedule.zoomIn() // nothing visible
3. schedule.zoomIn() // events are visible again

When I step through the debugger for TimeLineZoomable.zoomToLevel, it looks like minZoomLevel is 0 and maxZoomLevel is 23.

        // Sanitize numeric zooming.
        if (typeof preset === 'number') {
          preset = Math.min(Math.max(preset, this.minZoomLevel), this.maxZoomLevel);
        }

I am able to "fix" it in the following ways:

  1. Define minZoomLevel: 0 and maxZoomLevel: 10. Setting maxZoomLevel to 20 breaks.

screenshots:
after hitting zoomToFit:

Screen Shot 2020-09-11 at 2.55.40 AM.png
Screen Shot 2020-09-11 at 2.55.40 AM.png (81.69 KiB) Viewed 876 times

after hitting zoomIn:

Screen Shot 2020-09-11 at 2.55.48 AM.png
Screen Shot 2020-09-11 at 2.55.48 AM.png (23.3 KiB) Viewed 876 times

Post by dennisli »

I'v managed to add a "fix" by modifying the event store listener and more or less just cludging the zoomToFit, zoomIn/zoomOut together to force it to render events or something....

Before:

  scheduler.eventStore.listeners = {
    refresh: () => {
      const span: any = scheduler.eventStore.getTotalTimeSpan();
      // TODO: replace this with zoomToSpan once infinite scroll is added
      // See https://github.com/bryntum/support/issues/1114       
scheduler.setTimeSpan(span.startDate, span.endDate); }, ... }

After

scheduler.eventStore.listeners = {
    refresh: () => {
      const span: any = scheduler.eventStore.getTotalTimeSpan();
      // TODO: replace this with zoomToSpan once infinite scroll is added
      // See https://github.com/bryntum/support/issues/1114
      scheduler.setTimeSpan(span.startDate, span.endDate);

  // HACKY workaround 
  scheduler.zoomToFit(zoomToFitOptions);
  scheduler.zoomOut();
  scheduler.zoomIn();
  scheduler.zoomToLevel(15);
   },
    ....
}

Post by fabio.mazza »

Hi dennisli,

I am unable to reproduce your problem, could you send us a minimum test case to check please?

Here is my try and working fine:

Screen Shot 2020-09-11 at 14.34.46.png
Screen Shot 2020-09-11 at 14.34.46.png (93.73 KiB) Viewed 863 times

Thank you.

Best regards,
Fabio


Post by dennisli »

Providinig a minimum test case is going to be quite challenging given the proprietary nature of our data.. But I can try to provide more information i've since discovered:

It's not so much that the timeline isn't rendering but that the timeline hasn't rendered elements timeline elements or events. Maybe it's related to this? https://github.com/bryntum/support/issues/1114

I tried to illustrate this in the screen shots. Notice in the fully zoomed out view, the timeline extends from march
2020 to jan 2021. But as i zoom in the timeline simply doesn't render and the edges of the timeline change.. (eg renders nothing before May 2020 or nothing after Aug 2020)

When I step through the debugger it appears that the cursor is jumping because of TimelineViewPresets::setViewPreset, but perhaps this is expected behavior and a cache just isn't pre-rendering elsewhere? I'm not sure...

                        x = Math.max(Math.floor(me.getCoordinateFromDate(centerDate, true) - me.timeAxisSubGrid.width / 2), 0);
                        me.viewPresetActiveScroll = { left : x };

                    // The horizontal scroll handler must not invalidate the cached center
                    // when this scroll event rolls round on the next frame.
                    me.scrollingToCenter = true;

                    me.scrollHorizontallyTo(x, false);
Attachments
Screen Shot 2020-09-17 at 9.06.44 PM.png
Screen Shot 2020-09-17 at 9.06.44 PM.png (25.75 KiB) Viewed 845 times
Screen Shot 2020-09-17 at 9.06.40 PM.png
Screen Shot 2020-09-17 at 9.06.40 PM.png (40.86 KiB) Viewed 845 times
Screen Shot 2020-09-17 at 9.06.30 PM.png
Screen Shot 2020-09-17 at 9.06.30 PM.png (61.47 KiB) Viewed 845 times

Post by saki »

Would it be feasible for you to try to modify one of our demos to show the example, or modify an example slightly (without revealing your proprietary data/app) so that we can reproduce the problem locally?

If we can reproduce it we can fix it.


Post Reply