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

Panes

The Gantt contains two resizable and collapsible panes—a 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:

  • collapsible—Determines whether the pane can be collapsed through the user interface of the splitter bar.
  • collapsed—Sets 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
Change Theme:

Timeline Pane

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

The available configuration properties are:

  • collapsible—Determines whether the pane can be collapsed through the splitter bar user interface.
  • collapsed—Sets the initial collapsed or expanded state of the pane.
  • size—Sets the initial size of the pane. Has to be between the min and max properties.
  • min—Sets the minimum possible size of the pane.
  • max—Sets the maximum possible size of the pane.
  • resizable—Specifies 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
Change Theme:

In this article

Not finding the help you need?