New to Kendo UI for Angular? Start a free 30-day trial

Panes

The Gantt contains two resizable and collapsible panesa TreeList pane, which contains the data representation of the Gantt and which is rendered in a tree-list format, and the Timeline pane, which contains the tasks and the task dependencies that are rendered in any of the available Timeline views (day, week, or month).

TreeList Pane

To configure the TreeList pane options, use the treeListPaneOptions input of the Gantt.

The available configuration properties are:

  • collapsibleDetermines whether the pane can be collapsed through the user interface of the splitter bar.
  • collapsedSets the initial collapsed or expanded state of the pane.

The treeListPaneCollapsedChange event is emitted each time the pane is expanded or collapsed.

The following example demonstrates the settings of the TreeList pane:

Example
View Source
Edit In Stackblitz  
Change Theme:

Timeline Pane

To configure the Timeline pane options, use the Gantt timelinePaneOptions input.

The available configuration properties are:

  • collapsibleDetermines whether the pane can be collapsed through the splitter bar user interface.
  • collapsedSets the initial collapsed or expanded state of the pane.
  • sizeSets the initial size of the pane. Has to be between the min and max properties.
  • minSets the minimum possible size of the pane.
  • maxSets the maximum possible size of the pane.
  • resizableSpecifies if the user is allowed to resize the pane.

The Gantt emits the timelinePaneCollapsedChange event each time the pane is expanded or collapsed.

The following example demonstrates the settings of the Timeline pane.

Example
View Source
Edit In Stackblitz  
Change Theme:

In this article

Not finding the help you need?