让 Gantt 实现自适应

在智能手机上使用 Gantt 可能会因为屏幕较小而显得不太舒适，无法一次显示所有数据。然而，可以通过配置 Gantt 以适应不同的屏幕尺寸，从而在桌面和移动设备上使用。

如果将 Gantt 的尺寸以百分比设置（例如，width: 100%; height: 100%），它将根据可用的容器大小进行调整。然而，默认情况下，每个网格列的最小宽度由 min_column_width 与 min_grid_column_width 参数定义。当容器的宽度小于总的最小列宽时，网格将不再继续缩小。这可能会让人觉得 Gantt 不是自适应的。下列各节介绍了应对这一点、使 Gantt 真正自适应的方法。

调整最小列宽

一种方法是降低 min_column_width 与 min_grid_column_width 的数值。随着容器变小，Gantt 能进一步收缩，从而实现类似自适应的行为：

gantt.config.min_column_width = 30;
gantt.config.min_grid_column_width = 30;

相关示例 Gantt. Responsive container

为小屏幕调整布局

另一种方法是根据可用宽度切换 Gantt 的布局。当空间充足时，显示带有网格和时间线的完整布局。在窄屏幕上，为了更好地利用有限的空间，只显示网格或时间线中的一个。

这可以通过 onGanttRender 事件来实现。事件处理程序会检查 Gantt 容器的宽度、当前 layout 配置，并相应地更新 Gantt 的布局。

相关示例 Gantt. Responsive layout: dynamically hide/show the grid depending on the screen width