Column Spanning in TypeScript Gantt Chart Control
18 Nov 20181 minute to read
The Syncfusion® TypeScript Gantt Chart control supports column spanning, allowing adjacent cells to merge horizontally for improved layout clarity. This feature is useful for grouping related data or enhancing visual structure.
To enable column spanning, use the queryCellInfo event and set the colSpan property to define how many columns a cell should span.
In the following example, Work cells are spanned to improve visual clarity:
Customize border color of spanned columns
You can customize the border color of spanned cells using the queryCellInfo event. This event triggers before the cell is rendered, allowing you to apply custom styles dynamically.
The following example demonstrates how to change the border color of spanned cells:
Limitations
Column spanning is not compatible with the following features:
- Virtual scrolling
- Infinite scrolling
Ensure these features are disabled when using column spanning to avoid rendering issues.