1. 概述编辑
1.1 应用场景
点击图表的分类或系列时,可以超链到跟这个分类或系列相关的其他图表,扩展报表的展示内容,如下图所示:
1.2 实现思路
图表属性面板添加JavaScript类型的超级链接,通过设置系列参数,链接到指定的报表,如下图所示:
2. 示例编辑
2.1 设置主表数据
新建普通报表,添加内置数据集,如下图所示:
2.2 绑定主表数据
合并一片单元格,右键选择插入图表>饼图>等弧度玫瑰图,数据来源为数据集数据,数据配置如下图所示:
2.3 设计子表
2.3.1 利润分析
1)准备数据
新建普通报表,新建数据集 ds1,SQL 语句为:SELECT * FROM 利润分析
2)设计报表
合并一片区域单元格为 A1,插入柱形图,绑定图表数据,保存报表,重命名为利润分析.cpt,如下图所示:
2.3.2 销售情况
1)准备数据
新建普通报表,新建数据集 ds1,SQL 语句为:SELECT * FROM 销量
2)设计报表
合并一片区域单元格为 A1,插入多层饼图,绑定图表数据,保存报表,重命名为销售情况.cpt,如下图所示:
2.4 添加主表超链
1)在特效>交互属性中,添加超级链接>JavaScript,如下图所示:
2)在 JavaScript 窗口右上角的参数界面添加一个参数series,参数值选择系列名称,添加第二个参数为A,参数值设置为 A22 单元格的值,如下图所示:
注:若是要根据饼图的分类名判断,则将系列参数值设置为分类名即可。
JavaScript 代码如下:
if(series=='财务部') /*判断系列名称为财务部*/{
var URL='/webroot/decision/view/report?viewlet=doc/Advanced/Chart/利润分析.cpt';
window.open(FR.cjkEncode(URL));
//在新标签页打开报表
}
if(series=='销售部'){
var URL='/webroot/decision/view/report?viewlet=doc/Advanced/Chart/销售情况.cpt';
window.open(FR.cjkEncode(URL));
}
如需要在对话框中打开链接,可如下修改 JavaScript 代码:
var url = '';
if (series == '财务部') /*判断系列名称为财务部*/ {
url = '/webroot/decision/view/report?viewlet=doc/Advanced/Chart/利润分析.cpt';
}
if (series == '销售部') {
url = '/webroot/decision/view/report?viewlet=doc/Advanced/Chart/销售情况.cpt';
}
FR.doHyperlinkByGet({url:url,feature:'width=700,height=450,',title:'主页',target:'_dialog'}); //在对话框打开报表
2.5 效果预览
1)PC 端
保存主报表,点击分页预览,效果如下所示:
注:不支持移动端。
3.模板下载编辑
已完成模板参见:
%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Advanced\Chart\各部门反馈情况.cpt
%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Advanced\Chart\利润分析.cpt
%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Advanced\Chart\销售情况.cpt
点击下载模板: