反馈已提交

网络繁忙

FVS跳转网页链接/弹出框事件

  • 文档创建者:Carly
  • 历史版本:16
  • 最近更新:Alicehyy 于 2023-10-10
  • 1. 概述

    适用场景:安装了「FineVis数据可视化」插件的用户,可参考本文了解 FVS 的相关功能。

    1.1 版本

    报表服务器版本
    插件版本功能变动
    11.0V1.xV1.x 版本文档请参考:网页链接历史版本
    11.0.16V2.0.0

    原弹出框、网页链接事件合并入口为「网页链接/弹出框」事件,原网页链接「对话框」打开方式合并为「弹出框」打开方式

    1.2 应用场景

    通过点击 FVS 模板中的标题组件、图表组件的系列/分类或三维组件数据图层等,可实现在当前窗口/新窗口或通过弹出框打开网页或其他模板,并传递参数。

    效果如下图所示:

    B4CA5F37-2F78-4AA8-ACC9-C368E4602C41.GIF

    2. 功能介绍

    选中组件,点击「交互>点击事件」,选择「添加点击事件>网页链接/弹出框」。即可添加一个事件,如下图所示:

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

    2023-09-26_09-49-03.jpg

    设置项详细说明如下表所示:

    设置项
    简介

    事件名称

    根据实际需求自定义事件名称,不支持为空,且不支持与当前组件的其他事件重名

    打开方式

    支持设置打开方式为:新窗口、当前窗口、弹出框,选择「弹出框」时支持「样式设置」

    注:若模板挂载在数据决策系统中,打开方式为「新窗口」或「当前窗口」时,打开的是平台的「新标签页」或「当前标签页」

    弹出框「样式设置」如下图所示:

    注:样式设置在移动端不生效。

    Snag_5c3f54b8.png

    • 显示位置:可选择「居中显示」或「动态显示」

    • 关联线:选择「动态显示」时,支持设置触发对象和弹出框之间关联线的颜色,且颜色支持设置不透明度

    • 大小:弹出框的宽度和高度

    • 标题:可设置是否显示标题(即事件名称),以及标题文字的字符样式、颜色、对齐方式等

    • 边框背景:支持设置弹出框的背景为无、颜色、我的资源、自定义上传。设置方式同 组件边框背景 ,支持设置边框背景的不透明度

    • 内边距:可设置弹出框内容距离弹出框的边距

    内容链接

    网页链接

    1)绝对路径

    • 网页:确保当前服务器可访问该网址即可

    https://www.fanruan.com/

    • 模板:确保当前服务器可访问该网址即可

    http://localhost:8075/webroot/decision/view/report?viewlet=GettingStarted.cpt

    2)相对路径

    • 网页:需要将资源文件保存到%FR_HOME%\webapps\webroot文件夹下

    /webroot/1.png

    • 模板:需要将模板文件保存到%FR_HOME%\webapps\webroot\WEB-INF\reportlets文件夹下

          普通报表示例如下:

    /webroot/decision/view/report?viewlet=GettingStarted.cpt

          FVS模板示例如下:

    /webroot/decision/view/duchamp?viewlet=第一张FVS模板.fvs

    3)支持插入公式

    模板链接

    选择模板路径后,右侧出现「选择模板」按钮,点击即可选择当前工程下任意报表文件

    Snag_47306995.png

    参数

    支持添加参数,参数类型支持三种:

    1)当前组件字段:参数内容可与组件内容相结合,例如地图区域名,柱形图系列名等

    2)自定义公式编辑:可使用公式输入

    3)自定义内容:可直接填写文本

    3. 示例

    3.1 新建模板

    点击设计器菜单栏「文件>新建可视化看板」创建空白看板,设置模板名称为「FVS跳转网页链接或弹出框示例」,点击「创建看板」。如下图所示:

    Snag_5c7e2c2e.png

    3.2 准备数据

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

    1637028605FE74.png

    3.3 添加饼图组件

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

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

    1637028612s9Xz.png

    3.4 设置网页链接/弹出框事件

    选中饼图组件,点击「交互>点击事件」,添加点击事件「网页链接/弹出框」。

    设置事件名称为「销售详情」。

    打开方式选择「弹出框」。

    内容链接选择「模板链接」,点击「选择模板」选择设计器内置的 GettingStarted.cpt 模板。

    设置参数,参数名称为「地区」(与 GettingStarted.cpt 模板中参数名保持一致),参数类型选择「当前组件字段」,参数内容为「系列名」。

    企业微信截图_16956938781688.png

    3.5 设置弹出框样式

    3.5.1 动态显示

    设置显示位置为「动态显示」,其余设置项根据实际情况合理设置即可。本例设置如下图所示:

    Snag_5c9f8bd2.png



    3.5.2 居中显示

    页面1 设置好后,直接复制页面,在新页面中修改设置即可。

    89E584F7-55AB-4B10-8D02-107016EFDAD1.GIF

    设置显示位置为「居中显示」,勾选「显示标题」,可设置标题文字样式,这里显示的标题即为该事件的名称。如下图所示:

    Snag_b16072.png

    3.6 效果预览

    3.6.1 PC 端

    保存模板,点击右上角「预览」按钮。效果如 1.2 节所示。


    3.6.2 移动端

    预览方式请参考 FVS移动端预览 。

    动态显示时,当前效果对应原弹出框效果,以固定的弹窗样式打开。如下图所示:

    9530AA04-C3D4-4732-AD5B-D5986104921C.GIF

    居中显示时,当前效果对应原网页链接效果,以超链方式在当前窗口打开;

    4053272A-50F1-43B1-B35F-76D768C2B9F3.GIF

    4. 模板下载

    5. 相关推荐

    文档索引
    内容简介
    FVS三维组件点击跳出弹出框
    三维组件数据图层添加「网页链接/弹出框」事件,实现点击三维组件元素跳出弹出框,展示更多内容
    FVS实现跳转不同网页链接
    通过 JavaScript 事件,实现根据不同参数跳转不同网页链接


    附件列表


    主题: FineVis数据可视化
    • 有帮助
    • 没帮助
    • 只是浏览
    中文(简体)

    鼠标选中内容,快速反馈问题

    鼠标选中存在疑惑的内容,即可快速反馈问题,我们将会跟进处理。

    不再提示

    10s后关闭

    联系我们
    在线支持
    获取专业技术支持,快速帮助您解决问题
    工作日9:00-12:00,13:30-17:30在线
    页面反馈
    针对当前网页的建议、问题反馈
    售前咨询
    采购需求/获取报价/预约演示
    或拨打: 400-811-8890 转1
    qr
    热线电话
    咨询/故障救援热线:400-811-8890转2
    总裁办24H投诉:17312781526
    提交页面反馈
    仅适用于当前网页的意见收集,帆软产品问题请在 问答板块提问前往服务平台 获取技术支持