数据过滤器用于过滤出数据源中指定的数据,支持数据过滤脚本和数据表配置两种过滤方法。通过其中一种或两种过滤方法可将接口(数据分析服务、自定义接口或服务开发工作台)返回数据转换成您所需要的内容并展示在Web可视化组件上。本文介绍数据过滤器及其使用。

过滤方法

  • 数据过滤脚本

    基于JavaScript对接口返回的原始数据进行一定的加工以适配图表或文字组件的展示需求。

    脚本写法:

    • 接口定义如下:脚本框架只支持传入一个变量data,过滤器返回经过函数方法处理后的data。
      function _filter(data) {
        // do something...
        return data;
      }
    • 仅允许访问部分全局对象:Object、Array、Date、Math、parseInt、parseFloat、String、RegExp、Boolean、JSON。
  • 数据表配置

    系统自动解析接口返回或数据过滤脚本处理之后的结构化数据后,展示可供筛选的数据列表。

注意事项

  • 数据过滤器支持返回的数据格式:单值(Number、String、Boolean)、一维数据(一维JSON、一维表)、二维数据(一维JSON Array、二维表)。
  • 目前表格、折线图、柱状图、条形图、饼图和双Y轴折线图仅支持通过数据过滤脚本进行过滤。
  • 当您选中了两种过滤方法时,编写的数据过滤脚本优先生效后,数据配置表再自动解析处理后的数据。
  • 如果选中数据表配置处理二维数据,则系统默认仅解析数据源的第一组数据。

    例如,一维的JSON Array:[ { a: 1, b: 2, c: 3 }, { a: 4, b: 5, c: 63 }, { a: 7, b: 8, c: 9 },],经过数据表配置可解析出字段abc。如果您选中字段a,则处理后的结果就是第一组数据中字段a的值1

示例

  1. 配置API服务。
    本文以数据分析服务为例,详细内容请参见开发数据服务API
  2. 创建Web可视化应用并添加组件。
    本文以文字组件为例,详细内容请参见文字
  3. 选中文字组件,单击文字提交框右侧的配置数据源按钮。
  4. 在数据源配置面板,选择接口 > 数据分析服务,选择已创建的业务服务,获取返回数据。
    数据分析服务
  5. 通过数据过滤脚本,获取指定格式的数据。
    1. 选中数据过滤脚本复选框,输入数据过滤脚本,如图所示。
      过滤脚本

      如果编写的脚本比较复杂,您可单击数据过滤脚本输入框右上角的全屏,进行全屏编辑。

      数据过滤器提供了5个示例代码,您也可单击示例名称导入该示例代码后,根据实际需要进行修改,如图所示。

      导入示例
    2. 展开处理后结果显示框,查看处理后数据。
      处理结果

      当处理后数据不符合组件支持的数据格式时,还可通过数据表配置继续进行过滤。

  6. 选中数据表配置复选框。
    系统自动解析并显示可选字段项。数据表配置

    当数据字段比较多或字段名较长时,您可单击全屏显示进行查看。

  7. 选中需要展示的字段,查看处理后结果
    过滤结果

    您可单击调试配置,查看数据输入和过滤运行后的输出。

  8. 单击确定
    文字组件显示处理后数据。文字组件