历史版本4 :地图数据轮播和联动 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 应用场景

某些情况下地图轮播时需要将省份高亮展示,并且可以联动其他图表达到拓宽地图数据展示维度的目的,如下图所示:

C81E7B2F-5FB6-4320-B47D-04A1BFF04DAC.GIF

1.2 实现思路

  • 地图省份高亮的效果通过设置条件属性来实现。

  • 地图和其他图表之间的联动通过参数面板来实现,具体方法为将所有区域名放到参数面板上的一个文本控件里,文本控件初始化事件依次取值,赋给下拉框控件,然后用下拉框控件来过滤查询。

2. 示例编辑

2.1 数据准备

1)新建数据集 ds1,数据库查询语句为:SELECT * FROM 地图 where 省份 like '%省'

Snag_28bc4d.png

2)新建数据集 ds2,数据库查询语句为:SELECT * FROM 地图 where 1=1 ${if(len(省份)==0,"","and 省份='"+省份+"'")} and 省份 like '%省'

Snag_2ad9fa.png

2.2 报表设计

1)如下图将参数界面拖入到报表设计主体,参数界面中添加标签控件、下拉框控件、查询按钮、文本控件,其中文本控件设置为不可见。再将地图和柱形图拖入到报表设计主体中。

Snag_2cc033.png

2)编辑地图,如下图绑定好地图数据。

Snag_31ce85.png

如下图设置条件属性,实现轮播省份红色高亮的效果。

Snag_35360e.png

3)编辑柱形图,如下图绑定好柱形图的数据。

Snag_3832a4.png

4)选中文本框控件,设置文本框的控件值为公式:sql("FRDemo","select 省份 from 地图 where 省份 like '%省'",1)

Snag_3c5c14.png

文本框控件添加一个初始化事件,JS 代码为:

var text0=this.getValue();
var arr=text0.split(",");
var i=1;
var a=this.options.form.getWidgetByName("省份");
setInterval(function(){
var value=arr[i];
if(i<=arr.length){
a.setValue(value);
_g().parameterCommit();
if(i==arr.length-1){
i=0;
}
else{i=i+1;}
}
},5000);

5)选中下拉框控件,如下图设置数据字典

Snag_400416.png

2.3 效果预览

保存报表,点击表单预览,报表效果如应用场景中所示。

3. 模板下载编辑

已完成模板可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\frm\地图数据点轮播联动.frm

点击下载模板:地图数据点轮播联动.frm