search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

Looking for a way to update the viewport without having to scroll after render in DayPilot Scheduler

Asked by Alexandre
1 month ago.

Hello,
I'm working on implementing a zoom feature with the angular wrapper of DayPilot Scheduler
The problem I'm facing is when a user changes the zoom level I want to update cellDuration and cellWidth properties while staying centered on the current viewport, so the way I came up with is :
* update cellWidth and/or cellDuration
* store a 'scrollTo' object with current viewport for later usage
* call scheduler.update()
* onAfterRender() => if a "scrollTo" object exists scroll to this object

This results in a flickering and not-so-smooth behavior of double rendering.

In this sample of yours https://themes.daypilot.org/scheduler/create you use the same tactic of storing an object to scroll after rendering and fadeOut/fadeIn before after the render
which is (as far as I understand) a way to avoid the problem I describe here.

I'm looking for a way to postpone rendering , so when scheduler updates itself it would be already at the given "scrollTo" position.
I'm aware of the Scheduler.update({ ...., scrollTo: {}) syntax.
I think what I have in mind is an extra option which could be something like :

DayPilot.Scheduler.scrollTo(date | pixels[, animated[, position]], waitForUpdateCompleted );

And If waitForUpdateCompleted is true, Scheduler would render only once in the correct position.
I hope you get the idea

Thanks for any feedback or a way to solve my issue

Answer posted by Dan Letecky [DayPilot]
1 month ago.

You can take a look at the following tutorial:
https://code.daypilot.org/12302/angular-scheduler-zoom

It's an Angular sample that uses the built-in Scheduler zoom support which retains the scrollbar position after changing the zoom level.

The zoom feature also supports zoomPosition property which lets you define the reference point that will show the same date ("left" | "middle" | "right"):
https://api.daypilot.org/daypilot-scheduler-zoomposition/

Let me know if it doesn't help.

New Reply
This reply is
Your name (optional):