跳到主要内容

DHTMLX Gantt 概览

DHTMLX Gantt 是一个用于在浏览器中展示与编辑项目时间线的 JavaScript 组件。
它结合了可配置的数据表格、可缩放时间轴以及能理解工作时间、依赖关系与约束条件的调度引擎。

您可以利用它构建用于项目管理工具、建筑与制造计划、现场服务排程,或任何需要可视化时间线的应用程序。

DHTMLX Gantt 提供 Standard 和 PRO 两个版本。PRO 版本包括自动排程、关键路径、资源管理、动态加载等高级功能。


按框架快速开始

您可以将 DHTMLX Gantt 作为原生 JavaScript 组件使用,也可以集成到现代框架中。 从适合您技术栈的分步"入门指南"开始:


在线示例

要查看 DHTMLX Gantt 的实际效果,请访问在线示例:


核心能力

DHTMLX Gantt 结合了调度引擎、灵活时间线与资源工具。 以下部分介绍主要功能领域并指向更深入的文档。

项目调度

DHTMLX Gantt 的调度引擎理解项目结构与工作时间:

调度行为可根据您的规则或例如 MS Project 的逻辑进行调整。

时间线与数据表

组件由左侧数据表与右侧可缩放时间轴组成,两部分都可以高度自定义:

高级项目控制

实现更深入的项目跟踪:

资源与工作量管理(PRO)

PRO 版本增加完整的资源管理层:

它将 Gantt 图扩展为应用内的轻量级资源管理工具。

导出与生态系统

DHTMLX Gantt 可与外部系统集成并支持多种导出/导入格式:


前端与后端集成

前端集成

DHTMLX Gantt 是框架无关的原生 JavaScript 组件,可在所有现代浏览器中运行,可用方式包括:

针对 React:

针对 Angular / Vue / Svelte,可参考各自的 "How to start" 指南构建轻量封装组件。

后端集成

在后端,Gantt 通过 REST 风格的 API 通信:

因此,Gantt 易于集成进已有系统或新的微服务。


下一步

若您刚开始使用:

  1. 选择并完成适用于您框架的 入门指南
  2. 配置 表格列工作时间日历时间轴编辑行为
  3. 连接后端,设置 DataProcessor 与任务/链接/资源的 REST 接口。
  4. 在需要深度自定义时,查阅 GuidesAPI 文档

若您正在从旧版本升级,请查看 更新日志,了解最新功能与迁移指南。