适用场景：安装了「FVS大屏编辑模式」插件的用户，可参考本文了解 FVS 模板的相关功能。

1.1 版本

1.2 应用场景

通过点击 FVS 大屏模板中的图表系列/分类或三维组件数据图层，在当前弹窗/新窗口打开网页，并传递参数。

本文将提供两种方式：网页链接事件、JavaScript事件。

注：部分组件不支持「点击事件」，详情可参考文档 FVS组件交互属性 。

2.1 网页链接

选中组件，点击「交互>点击事件」，选择「添加点击事件>网页链接」。即可添加一个网页链接事件，如下图所示：

各设置项详细说明如下表：

2.2 JavaScript

选中组件，点击「交互>点击事件」，选择「添加点击事件>JavaScript」。即可添加JavaScript代码实现在新标签页打开网页链接的功能，如下图所示：

常用 JavaScript 代码如下表所示：

注：以下代码均是在新标签页打开，如需在当前页打开，将 window.open 替换为 window.location.replace 即可。

window.open("https://www.fanruan.com/");

window.open("http://localhost:8075/webroot/decision/view/report?viewlet=GettingStarted.cpt");

window.open("http://localhost:8075/webroot/decision/view/report?viewlet=GettingStarted.cpt&地区="+area);

if(series=='华东') /*判断系列名为华东*/
{
var URL='/webroot/decision/view/report?viewlet=demo/basic/产品明细.cpt'; 
window.open(encodeURI(encodeURI(URL))); //在新标签页打开产品明细.cpt
}
if(series=='华北') /*判断系列名为华北*/
{
var URL='/webroot/decision/view/report?viewlet=demo/basic/分组统计.cpt'; 
window.open(encodeURI(encodeURI(URL))); //在新标签页打开分组统计.cpt
}

3.1 新建大屏模板

用户点击菜单栏「文件>新建大屏模板」，设置大屏模板名称为「FVS网页链接跳转示例」，点击「确定」，如下图所示：

3.2 新建数据集

用户新建数据库查询「ds1」，SQL语句：SELECT * FROM 销量 。如下图所示：

3.3 添加饼图组件

在「页面1」，用户选择组件区「图表>饼图类>饼形图」，点击添加到页面中。

选中组件，在配置区设置组件「内容>数据」，设置数据集为「ds1」，分类为「无」，系列名为「地区」，值为「销量」，具体如下图所示。

组件样式可根据个人喜好设置，本文不再赘述。

本章示例：通过点击饼图的系列，在当前窗口弹窗打开一个子模板。并且将饼图的系列名作为参数值传递到子模板中。

请先按照第三章完成基础模板制作，再基于基础模板进行本章操作。

4.1 设置网页链接事件

打开第三章制作的 FVS 大屏模板。

选中饼图组件，点击「交互>点击事件」，添加点击事件「网页链接」。

设置事件名称为「销售详情」，网页地址为 /webroot/decision/view/report?viewlet=GettingStarted.cpt ，网页框大小为「800*600」。

注：V1.5.0 版本及之后的插件中，可点击「模板路径>选择模板」，直接选择当前工程下的报表文件。

设置参数，参数名称为「地区」，参数类型选择「当前组件字段」，参数内容为「系列名」。

4.2 效果预览

保存模板，点击右上角「预览」按钮。

通过点击饼图的系列，在当前窗口弹窗打开一个子模板。并且将饼图的系列名作为参数值传递到子模板中。

本章示例：通过点击饼图的系列，在新窗口打开一个子模板。并且将饼图的系列名作为参数值传递到子模板中。

请先按照第三章完成基础模板制作，再基于基础模板进行本章操作。

5.1 设置JavaScript事件

打开第三章制作的FVS大屏模板。

选中饼图组件，点击「交互>点击事件」，添加点击事件「JavaScript」。

设置事件名称为「网页跳转JS」。

设置参数，参数名称为「area」，参数类型选择「当前组件字段」，参数内容为「系列名」。

设置JavaScript执行脚本为：

window.open("http://localhost:8075/webroot/decision/view/report?viewlet=GettingStarted.cpt&地区="+area);

5.2 效果预览

保存模板，点击右上角「预览」按钮。

通过点击饼图的系列，在新窗口打开一个子模板。并且将饼图的系列名作为参数值传递到子模板中。

本章示例：按照点击的饼图的系列名，在新窗口打开不同的子模板。

请先按照第三章完成基础模板制作，再基于基础模板进行本章操作。

6.1 设置JavaScript事件

打开第三章制作的 FVS 大屏模板。

选中饼图组件，点击「交互>点击事件」，添加点击事件「JavaScript」。

设置事件名称为「跳转不同模板」。

设置参数，参数名称为「area」，参数类型选择「当前组件字段」，参数内容为「系列名」。

设置 JavaScript 执行脚本为：

if(area=='华东') /*判断系列名为华东*/
{
var URL='http://localhost:8075/webroot/decision/view/report?viewlet=demo/basic/产品明细.cpt'; 
window.open(encodeURI(encodeURI(URL))); //在新标签页打开产品明细.cpt
}
if(area=='华北') /*判断系列名为华北*/
{
var URL='http://localhost:8075/webroot/decision/view/report?viewlet=demo/basic/分组统计.cpt'; 
window.open(encodeURI(encodeURI(URL))); //在新标签页打开分组统计.cpt
}

6.2 效果预览

保存模板，点击右上角「预览」按钮。

按照点击的饼图的系列名，在新窗口打开不同的子模板。、

已完成模板请参见：FVS网页链接跳转示例.fvs

示例一、示例二、示例三分别对应模板中的页面1、页面2、页面3。