反馈已提交

网络繁忙

FVS图表排序接口

  • 文档创建者:Fay
  • 历史版本:5
  • 最近更新:TW 于 2024-10-23
  • 1. 概述

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

    1.1 版本

    报表服务器版本
    插件版本
    11.0.16V1.15.1

    1.2 应用场景

    图表数据展示的顺序是由图表绑定的数据顺序决定的,一般建议在 SQL 中排好序再用图表实现。

    但总有些场景不支持提前在 SQL 中排好序,或需要图表实现动态排序,此时可参考本文方法使用排序接口实现。

    1.3 功能简介

    通过 sortChart(sortType) 接口实现图表排序。

    sortType 参数表示排序规则,1 表示升序,-1 表示降序,不写参数则升序降序互相切换。

    注:不支持 扩展图表 类型的图表。

    预览效果如下图所示:

    22.gif

    2. 示例

    2.1 新建模板

    点击设计器左上角「文件>新建可视化看板」,创建一张空白看板,可自定义模板名称和尺寸。如下图所示:

    1.png

    2.2 准备数据

    新建数据库查询, 输入 SQL 查询语句:SELECT * FROM 销量 。

    20.png

    2.3 添加图表

    1)点击组件区「图表>条形图」,并绑定数据如下图所示:

    52.png

    2)选中条形图,点击右侧配置面板「组件」,设置组件名称为「条形图」。如下图所示:

    55.png

    2.4 添加标题

    1)点击组件区的「其他>标题」,新建一个标题,将「标题内容」改为 排序 。如下图所示:

    53.png

    2)点击标题,给标题添加「鼠标点击」,输入JavaScript代码如下:

    duchamp.getWidgetByName("条形图").sortChart();//排序可切换升降序

    如下图所示:

    54.png

    2.5 效果预览

    2.5.1 PC 端

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

    2.5.2 移动端

    预览方式请参考 FVS移动端预览 ,效果如下图所示:

    A65C664B-49F8-4CF5-A6FC-6351E2894268.GIF

    3. 模板下载

    点击下载模板:FVS图表排序接口.fvs

    附件列表


    主题: FineVis数据可视化
    已经是第一篇
    已经是最后一篇
    • 有帮助
    • 没帮助
    • 只是浏览
    中文(简体)

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

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

    不再提示

    10s后关闭



    AI

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