html5动态图表工具FineReport:[15]甘特图

2025-11-06 16:11:30

1、 数据准备

新建工作薄,添加内置数据集如下:

在单元格中统计出每个步骤的计划开始与结束时间、实际开始与结束时间及完成百分比,作为图表数据来源,如下图:

注:每个步骤的时间必须是纵向排列,活动必须为横向排列,即上面的表格必须保持一样的展现方式。

数据列设置如下:

单元格数据集数据列属性

C1    ds1    步骤                         从左到右扩展,其余默认

C2    ds1   计划开始时间              从左到右扩展,其余默认

C3    ds1   计划结束时间               从左到右扩展,其余默认

C4    ds1   实际开始时间               从左到右扩展,其余默认

C5    ds1   实际结束时间               从左到右扩展,其余默认

C6    ds1   完成百分比                  从左到右扩展,其余默认

html5动态图表工具FineReport:[15]甘特图

html5动态图表工具FineReport:[15]甘特图

2、插入图表

以悬浮图表为例,点击插入>悬浮元素>插入图表,选择甘特图,点击确定。

3、设置图表数据

html5动态图表工具FineReport:[15]甘特图

4、 保存并预览

保存模板,点击分页预览,便即可看到如上的效果。模板效果在线查看请点击GanttChart.cpt

已完成模板可参考%FR_HOME%\WebReport\WEB-INF\reportlets\doc\Advanced\Chart\GanttChart.cpt。

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢