历史版本1 :下拉框实现直接联动图表 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1.概述编辑

通过报表和图表联动,利用单元格的超链接-图表超链-联动悬浮元素方法可以很容易做到点击报表中的某个数据,实现图表联动,但是有时报表中不需要展示数据,只需要选择不同的项目或类别,就可以实现图表联动,如下图只需要在下拉框中选择不同的销售员,下面对应的图表中自动联动出该销售员的数据折线图。这种效果如何做到的呢。
222


2.实现思路

以超链接中图表联动为依据,通过下拉框编辑后事件控制单元格值,可以通过设置一个单元格的超链接来联动图表,再模拟点击此超链接,即可实现联动,用到contentPane.setValue(),以及jquery中对象点击事件,以及填报中动态设置值与获取值的一个小技巧。


3、实现过程编辑

3.1  新建一个模板

B1为销售员标签,C1为选择销售员下拉框,B3-G16合并单元格,放置图表,设置为折线图

222

3.2 新建数据集ds1
为C1销售员下拉框数据字典

sql为select distinct 销售员 from 销量
222

C1下拉框数据字典设置如下


222

3.3 新建数据集ds2

为图表对应的数据集,并为销售员指定默认值孙林

sql为SELECT * FROM 销量 where 销售员='${销售员}'
222

3.4 设置图表属性

选中B3,在右上角图表属性中设置图表数据,来源为数据集ds2,其他设置如下图

222   222

 3.5 设置D1超链接

D1单元格为准备存放销售员的单元格,以此单元格来联动B3单元格中存放的图表

222


注:这里注意联动的销售员必须是单元格号,不能用公式=$$$,否则取不到用JS动态设置到此单元格的值

 3.6 设置C1下拉框编辑后事件


222
JS代码如下

//将当前选择的销售员设置进D1单元格 contentPane.setCellValue('D1',null,this.getValue()); //点击D1单元格中的超链接 $('td[id^=D1] .linkspan').click();

 3.7 保存预览

保存后,进行填报预览,即可看到概述中的效果