How to change the appearance of an Angular timeline view?

The Angular Scheduler includes the following timeline views:

• Timeline Day,
• Timeline Week,
• Timeline Work Week,
• Timeline Month and
• Timeline Year views.

The events or appointments are arranged in the horizontal order in the timeline views, which helps to organize the tasks with multiple projects.

Customize Angular Scheduler timeline views

The Angular Scheduler provides options to customize its complete UI in the following ways.

View options

The Angular Scheduler timeline view supports various view-based customizations. These are listed below:

• Interval: Used to change the default interval set to the Angular Scheduler. For example, a day view can be extended to display three days by setting the interval option as 3.
• Workdays: This workdays property is used to define the custom workdays of the week. For example, Monday, Wednesday, and Friday are only set to work days.
• Show weekend: Used to show or hide week end days.

Sample link:

https://ej2.syncfusion.com/documentation/schedule/views/#timeline-views--day-week-work-week

Blocking dates and time

In timeline views, you can block specific time intervals or days on the Angular Scheduler.

Sample link:

https://ej2.syncfusion.com/demos/#/material/schedule/block-events.html

Date header

This option is used to customize the date header cells of the timeline month view.

Sample link:

https://ej2.syncfusion.com/angular/demos/#/material/schedule/date-header-template

Header rows

Unlike the usual date and time rows, timeline view can be displayed with additional header rows to display the years, month, and week numbers.

Sample link:

https://ej2.syncfusion.com/angular/demos/#/material/schedule/header-rows

Time scale

The time scale option is used to customize the grid lines, the interval, slot count, and major slot and minor slot of the Scheduler, and you also customize them by using template.

Sample link:

https://ej2.syncfusion.com/angular/demos/#/material/schedule/time-scale