多语言展示
当前在线:953今日阅读:26今日分享:39

Java表格控件FineReport:[3]图表联动

图表联动:单个模板的图表超链功能,可让用户在同一页面中查看多张关联的图表,实现图表联动的效果,这种联动是自动的,不需重新刷新整个页面,如下图:
工具/原料
1

Java表格控件:FineReport

2

电脑

方法/步骤
1

数据集设计新建工作簿,添加数据集ds1,SQL语句为:SELECT * FROM Sales_Car;添加数据集ds2,SQL语句为:SELECT * FROM Sales_Car where month ='${month}',给参数month设置默认值为1月。注:这边参数的值将从图表链接处传过来。

2

图表设计主图表设计选中一边区域单元格,合并单元格。在菜单栏中,选择插入>单元格元素>插入图表,图表类型选择柱形图,使用数据集数据,设置如下图:

3

再选中一片区域,合并单元格。在菜单栏中,选择插入>单元格元素>插入图表,图表类型选择折线图,图表数据来源于数据集数据,数据集为ds2,分类轴为Province,系列名使用字段值,系列名称为Month,系列值为Amout,汇总方式为求和,如下图:

4

在菜单栏中,选择菜单>悬浮元素>插入图表,选择面积图,图表的数据与单元格子图表设计相同。右击该悬浮图表,点击设置悬浮元素名称修改名称为FloatChart。

5

图表联动设置添加单元格联动图表选中主图表,选择图表属性设置-特效>交互属性,点击超级链接,添加一个图表超链-联动单元格,选择图表所在单元格,并传递参数month,参数值选择分类名:

6

在添加一个图表超链-联动悬浮元素,选择悬浮图表FloatChart,同样添加参数month,参数值为分类名。

7

效果展示模板效果在线查看请点击RelateChart.cpt点击分页预览即可查看效果,具体模板可参考:%FR_HOME%\WebReport\WEB-INF\reportlets\doc\Advanced\Chart\RelateChart.cpt注:7.0.4之前的版本在IE9以下的浏览器下不支持图表联动,需要安装chrome frame插件,才可以在IE9以下的版本上运行图表联动的模板,7.0.4以及之后版本均支持IE6/7/8下的图表联动。

推荐信息