This sample allows you to customize the Gantt chart timeline by adjusting the timeline unit size, header text format, and count for both the top and bottom tiers, and provides an option to enable the multitaskbar feature.
ID | Name | Start Date | End Date | Duration | Dependency | Progress |
|---|---|---|---|---|---|---|
| No records to display |
Feb 03, 2024 | Feb 04, 2024 | Feb 11, 2024 | Feb 18, 2024 | Feb 25, 2024 | Mar 03, 2024 | Mar 10, 2024 | Mar 17, 2024 |
|---|
S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F |
|---|
Timeline Unit Size | |
Top tier | |
Count | |
Unit | |
Format | |
Bottom tier | |
Count | |
Unit | |
Format | |
Enable multitaskbar |
This example demonstrates how to effectively customize the timeline settings of a Gantt chart. You can customize the timeline width by adjusting the timelineunitsize property in timelineSettings. The Gantt chart supports various timeline units such as minutes, hours, days, weeks, months, and years. You can easily customize these units by changing the unit for both top tier and bottom tier in timelineSettings. The format of the timeline can be customized by modifying the format value for both the top and bottom tiers. You can combine timeline cells in the top and bottom tiers using the count property in timelineSettings.
Tooltips are visible by default in the Gantt chart timeline, You can customize the tooltip visiblity by using the showtooltip property in the timeline settings.
enablemultitaskbar allows you to display multiple taskbars within a parent row, ensuring a clear overview even in collapsed states.
Gantt component features are segregated into individual feature-wise modules. To use a selection and markers support, inject the SelectionService and DayMarkersService into the @NgModule.providers section respectively.