最新历史版本 :图表刷新接口 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 预期效果

点击按钮可以刷新普通报表或决策报表中的图表,以普通报表为例,效果如下图所示:

1591354480168438 (1).gif

1.2 实现思路

通过FR.Chart.WebUtils.getChart("chartID").dataRefresh()获取要刷新的图表对象,其中chartID为图表块名称。

注1:该接口不支持扩展图表。

注2:该接口支持11.0.66及之后版本的移动端。

注3:获取图表对象的方法参见文档:如何获取图表对象

注4:该接口不支持 FVS 可视化看板。

2. 示例编辑

2.1 准备数据

新建普通报表,新建数据集 ds1,SQL 语句为:SELECT * FROM 销量 limit ${ int (RAND()*40) }

注:int (RAND()*40)表示随机生成大于等于 0 小于 40 的整数,刷新时可动态改变数据量。

Snag_fbac9e9.png

2.2 设计表格

A1 单元格添加「按钮控件」,命名为「点击刷新」。A3 单元格插入「柱形图」,如下图所示:

1591355111692090.png

2.3 绑定图表数据

选中 A3 单元格,绑定柱形图数据,如下图所示:

Snag_fc25a30.png

2.4 设置刷新事件

选中 A1 单元格,右边属性面板选择「控件设置>事件」,添加一个点击事件,如下图所示:

1591355399285975.png

JavaScript 代码如下:

var chartWrapper1 = FR.Chart.WebUtils.getChart("A3");
chartWrapper1.dataRefresh();

2.5 效果预览

2.5.1 PC 端

保存报表,点击「数据分析预览」,效果如下图所示:

1591354480168438 (1).gif

2.5.2 移动端

1591355591459036.gif

3. 模板下载编辑

已完成模板参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Chart\GraphSwitching\图表刷新接口示例.cpt

点击下载模板:图表刷新接口示例.cpt