反馈已提交

网络繁忙

单元格联动ECharts图表

  • 文档创建者:Alicehyy
  • 历史版本:10
  • 最近更新:Alicehyy 于 2024-03-01
  • 1. 概述

    1.1 版本

    报表服务器版本插件版本
    11.0V1.0.0

    1.2 预期效果

    当使用 ECharts 图表引用模板数据集 时,若该数据集中设置了参数,那么 ECharts 图表也是可以根据参数动态显示的,但如果想将参数传递给 ECharts 图表,例如 图表超链-联动单元格 文档中,将单元格中的地区字段作为参数传递给柱形图的标题,该如何做呢?预期效果如下图所示: 

    1.gif

    1.3 实现思路

    其他组件或单元格正常设置参数,ECharts 图表利用 FR.remoteEvaluate() 接收传来的参数并使用。

    2. 示例

    2.1 准备模板

    在设计器中新建普通报表,新建两个数据集。

    ds1:SQL 查询语句为 SELECT * FROM 销量 。获取销量表中全部数据。

    ds2:SQL 查询语句为SELECT * FROM 销量 WHERE 1=1  ${if(len(area) == 0,"","and 地区 = '" + area + "'")} ,实现了参数 area 为空时获取全部数据,否则根据参数 area 获取对应数据。

    Snag_a43896a.png

    2.2 设计模板

    2.2.1 添加表格

    A1~C2 单元格设计为表格,将数据集 ds1 中的字段拖到对应单元格中。其中「销量」字段的数据设置需修改为「汇总>求和」。

    如下图所示:

    2.2.2 添加图表

    合并一片区域单元格为 A5 ,点击工具栏中的「插入图表」按钮,选择 ECharts 图表。如下图所示:

    Snag_a4de9aa.png

    2.2.3 设置单元格超链

    选中地区字段所在的 A2 单元格,添加一个联动单元格图表的超链,设置联动单元格为图表所在单元格 A5 ,并添加参数 area,其值为公式 =$$$(表示当前值)。

    这样做可实现将点击的「地区」赋值给参数 area,再将参数传递给 A5 单元格的图表。

    如下图所示:

    Snag_a560ac7.png

    2.3 配置图表

    2.3.1 添加数据结构

    给 ECharts 图表添加一个二维数组结构,绑定设置了参数的 ds2 数据集中的「销售员」和「销量」字段。如下图所示:

    2.3.2 编辑代码

    点击「代码编辑器」,因为 ds2 数据集中定义的参数为 $area ,所以通过 FR.remoteEvaluate("$area") 接收参数。输入代码如下所示:

    var titleText; if (window.FR) {  titleText = window.FR && window.FR.remoteEvaluate("$area");} var TABLE_DATA = getData('data1'); option = {  title: {    text: titleText + '地区销量统计图',    left: "center"  },  tooltip: {},  dataset: {    source: TABLE_DATA,  },  xAxis: { type: "category" },  yAxis: {},  series: [{ type: "bar" }],};

    点击「运行」,效果如下图所示:

    4.png

    2.4 效果预览

    保存报表,点击「分页预览」,效果如 1.2 节预期效果所示。

    注:不支持移动端。

    3. 模板下载

    点击下载模板:单元格联动ECharts图表.cpt

    附件列表


    主题: 图表应用
    已经是第一篇
    已经是最后一篇
    • 有帮助
    • 没帮助
    • 只是浏览
    中文(简体)

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

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

    不再提示

    10s后关闭



    AI

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