Using the Gantt component

The Gantt component provides interactive features that help you manage timeline views, adjust row display, and reschedule tasks efficiently. This explains how to change the timeline view mode, modify row height for better visibility, and move tasks directly on the timeline. Use these options to customize the Gantt display to suit your scheduling needs and improve overall usability.

Using the View mode

Use the view mode control to change the timeline cadence. The selected view mode determines how time is grouped and displayed across the timeline.

  1. When viewing the Gantt component, click the view mode button near the timeline section. By default, the button displays the currently selected view mode.
  2. Select the view mode to use:
    Half Hour
    Hour
    Quarter Day
    Half day
    Day
    Week
    Month
    Year
    The timeline updates immediately to show the selected mode.

Using Row height

Use the row height control to change the height of rows in the timeline and resource panel.

  1. When viewing the Gantt component, click the Row height button above the timeline section along the View mode button.
  2. Select the row height to use:
    Extra extra small
    Extra small
    Small
    Medium
    Large
    The timeline updates immediately to show the selected row height

Rescheduling tasks

If an update operation has been configured, you can reschedule tasks directly on the timeline using drag and drop.

  1. Click and hold a task bar on the timeline.
  2. Drag the task to a new time slot or resource row.
  3. Release the task to confirm the new schedule. The component calls the configured Update operation to save the change.