Web报表表单组件联动实现

在数据展示中，报表与图表常需联动呈现，以体现数据间的关联性。本文以Web企业报表FineReport为例，说明如何实现报表与图表的交互与协同，提升数据分析的直观性与实用性。

1、 启用模板

2、 新增功能模块

3、 所示，将饼图组件拖至柱形图左侧即可。

4、 新增数据集

5、 创建数据集ds2：从数据表中查询所有字段，条件为恒成立的1=1，并根据参数product是否存在追加筛选条件，若product不为空，则增加且产品类型等于指定值的过滤规则。

6、 组件与数据联动

7、 饼图

8、 选中饼图组件后，在右侧属性面板的数据选项中进行数据设置，所示。

9、 柱形图

10、 选中柱形图后，将数据源更改为新建的ds2数据集，分类轴保持为销售员，系列名称改为产品，系列值仍为销量，具体设置所示。

11、 设置超级链接

12、 点击饼图时，其数据会传递至柱形图，导致柱形图所绑定的数据集ds2参数更新，从而使柱形图随之动态变化，实现图表间的联动效果。

13、 所示，选中饼图后，进入图表属性中的特效设置，点击交互属性并添加超级链接。链接方式设为当前表单对象，选择对应的柱形图组件，并添加一个名为product的参数，其值设为当前系列名称。

14、 若需链接至当前表单内其他组件，应选用当前表单对象作为超级链接方式，确保跳转正确无误。

15、 确认并保存模板。

16、 表单样式设计

17、 在表单右下角的组件列表中选择body主框架，将其内边距设为10，组件间距设为5，具体设置所示。

18、 为表格及两个图表组件分别添加黑色边框。选中表格组件后，点击上方属性表中样式右侧的选项按钮，进入设置界面，调整边框样式与颜色，按图示完成配置。

19、 用相同方式为其余两个图表组件添加边框。

20、 查看效果

21、 点击预览按钮，在网页端打开模板，选择饼图中的扇形区域，即可呈现所示视觉效果。