甘特图通过条状图来显示项目、进度和其他时间相关的系统进展的内在关系随着时间变化的情况。其中，横轴表示时间，纵轴表示任务。线条表示在整个期间上计划和实际的任务完成情况。甘特图可以直观地表明任务计划在什么时候进行，及实际进展与计划要求的对比。管理者由此可以非常便利地弄清每一项任务还剩下哪些工作要做，并可评估工作是提前还是滞后，亦或正常进行。下图为一个简单的单项目甘特图，该项目包含需求调研、功能开发、验收测试3个任务：以计划实际完成百分比甘特图为例，介绍其制作方法。
工具/原料
1
html5动态图表工具：FineReport
2
电脑
方法/步骤
1
数据准备新建工作薄，添加内置数据集如下：在单元格中统计出每个步骤的计划开始与结束时间、实际开始与结束时间及完成百分比，作为图表数据来源，如下图：注：每个步骤的时间必须是纵向排列，活动必须为横向排列，即上面的表格必须保持一样的展现方式。数据列设置如下：单元格数据集数据列属性C1 ds1 步骤 从左到右扩展，其余默认C2 ds1 计划开始时间 从左到右扩展，其余默认C3 ds1 计划结束时间 从左到右扩展，其余默认C4 ds1 实际开始时间 从左到右扩展，其余默认C5 ds1 实际结束时间 从左到右扩展，其余默认C6 ds1 完成百分比 从左到右扩展，其余默认
2
插入图表以悬浮图表为例，点击插入>悬浮元素>插入图表，选择甘特图，点击确定。
3
设置图表数据
4
保存并预览保存模板，点击分页预览，便即可看到如上的效果。模板效果在线查看请点击GanttChart.cpt已完成模板可参考%FR_HOME%\WebReport\WEB-INF\reportlets\doc\Advanced\Chart\GanttChart.cpt。