世俱杯 2025

想要购买dhtmlxDiagram正版授权，或了解慧都APS系统请点击

dhtmlxGantt是用于跨浏览器和跨平台应用程序的功能齐全的Gantt图表。可满足项目管理应用程序的所有需求，是最完善的甘特图图表库。它允许你创建动态甘特图，并以一个方便的图形化方式可视化项目进度。有了dhtmlxGantt，你可以显示活动之间的依赖关系，显示具有完成百分比阴影的当前任务状态以及组织活动到树结构。

点击下载dhtmlxGantt试用版

从版本5.0开始，Gantt提供了指定可配置布局并将组件的元素安排为布局内部视图的可能性。它允许您使用其他时间轴和网格来制作灵活的甘特图结构并定义各种布置元素的方案。

例如，您可以在时间线的右侧放置一个网格：

或在默认网格下方添加另一个网格和时间线。

通过gantt.config.layout配置选项设置布局。布局的默认配置如下：

gantt.config.layout = {
    css: "gantt_container",
    rows:[
        {
           cols: [
            {
              // the default grid view  
              view: "grid",  
              scrollX:"scrollHor", 
              scrollY:"scrollVer"
            },
            { resizer: true, width: 1 },
            {
              // the default timeline view
              view: "timeline", 
              scrollX:"scrollHor", 
              scrollY:"scrollVer"
            },
            {
              view: "scrollbar", 
              id:"scrollVer"
            }
        ]},
        {
            view: "scrollbar", 
            id:"scrollHor"
        }
    ]
}

甘特图的布局由被视图占据的单元格组成。主要和辅助甘特元素由视图呈现，它们是：

• grid-定义甘特图的网格部分。预定义的用于显示任务的主网格具有id：“ grid” ;
• 时间线-定义甘特图的时间线部分。预定义的用于显示任务的主时间轴具有ID：“ timeline”；
• 调整大小-定义调整大小行。要启用调整器，您需要将resizer属性设置为true。仅在PRO版中提供;
• 滚动条-定义甘特图中使用的滚动条。网格和时间轴视图可以绑定到特定的滚动条。阅读下面的详细信息。
• resourceGrid-资源面板的预配置网格。仅在PRO版本中可用。
• resourceTimeline-资源面板的预配置时间线。仅在PRO版本中可用。

视图配置被指定为具有相应属性的对象。您可以为网格视图和时间轴视图设置自定义配置选项。默认选项来自全局gantt.config对象。

下一节内容中我们将继续讲解如何设置滚动条！

想要购买dhtmlxDiagram正版授权，或了解慧都APS系统请点击