Scroll to current date and show time

Event calendars & schedulers
1

Hi, in the demos the timeline often automatically is scrolled to the current date and additionally shows the current time with an extra line.

capture_003_10032022_231823

In the demo codes I didn’t find how to achieve this and my view always starts with 1st.

How can I get this done?

2

The time indicator will show up automatically for the current day when the timeline type is day or week.
Where the view starts depends on the type and the size as well. There is a reference date that the current view is calculated from. This reference date can be set with the refDate option.

Does that help?

3

Thanks, it has helped, but unfortunately it’s still not working :wink:

My timeline type is month and I just want to scroll to the current date. I didn’t get it working with my tries with the refDate .
Can you please help me how to achieve this?
Thanks!

4

Hey @Bastifix

If you just want to navigate to the current day programmatically, then you can use the navigate method of the Eventcalendar instance. You can access the instance using a @ViewChild decorator and a template variable, for example:

<mbsc-eventcalendar #myTimeline ...></mbsc-eventcalendar>

And then in your ts:

@ViewChild('myTimeline')
inst: MbscEventcalendar;

ngAfterViewInit() {
  this.inst.navigate(new Date());
}

Let me know if that helps!

5

Thanks!
Yes, that helped and it’s scrolling now. But it’s not scrolling to the current date (stopping earlier) (log: Wed Mar 30 2022 23:20:30 GMT+0200)

Scolling:

capture_001_30032022_232102
capture_001_30032022_232102959×286 9.13 KB

6

Hi Bastifix,

Could you please share the relevant code on how to reproduce this?