跳到主要内容

表格拼接(bdpTable)

选择Javascript语言,bdpTable提供了表格处理的函数方法,几行函数实现所需的自定义表格,如多表格合并。包含三种简易方法和两种自定义方法,可根据需求组合使用。

其中为了简化用户操作,直接拼接和关系拼接的表格结构、顺序、表头直接使用数据集中结构,可通过调整数据集结果调整表格最终展现效果。参数中使用的数组、对象须满足JS语法。

1. 生成图表

  • render()

说明:表格生成函数,所有预置的表格功能最后需要调用。

2. 字段引用

表格拼接支持两种字段的引用方式,具体参考函数说明。

  • 相对引用:通过位置相对引用数据集和字段,T代表数据集,X代表维度,Y代表数值,如“%T0.X0%”代表 数据集1的维度1。
  • 绝对引用:通过数据集、字段的名称引用,这种方式较简便,注意在数据集、字段名称调整时无法正确使用。

3. 直接拼接

joinTable()

说明:默认将“数据视图”中的所有数据集按照其顺序,合并成一个表格,不需要参数。

使用示例:

bdpTable.joinTable();
bdpTable.render();

有如下两个表格(数据集),需要放在同一个表格中展示,可解决如数据行数过多,需要横向展示。

表格1:

年份年销售额
2016100亿

表格2:

季度季度销售额
2016Q120亿
2016Q280亿

结果表:

年份年销售额季度季度销售额
2016100亿2016Q120亿
-2016Q280亿

4. 关系拼接

joinTable({[[fields],[fields]....,[fields]])//相对引用
joinTbale([fields])//绝对引用

说明:默认将“数据视图”中的所有数据集按指定的“公共字段”,支持多个公共维度,合并成一个表格。不支持数值字段作为公共维度。支持数据集的对比功能。

参数:fields支持两种方式

  • 绝对引用,使用字段名,参数为一个包含公共字段名称的一维数组,要求多数据集公共字段相同,不用重复设置相同字段名;如['公共字段1'],此时会根据这个字段合并所有数据集。
  • 相对引用,使用位置,需要指定每个数据集所使用的公共字段的二维数组,每个数组间代表不同的公共字段,每个数组内为某一个公共字段再每个数据集的引用位置。数据集间字段按顺序对应,如[['%T0.X0%'],['%T1.X0%']],分别设定数据集1、2的维度1为公共维度。

原理:实现了SQL中全关联,默认以第一个数据集的公共字段查找所有数据集中的数据,之后依次查找第二个、第三个数据集中剩下的公共字段内容。

使用示例:

//joinTable(['公共字段1','公共字段2'])  //绝对引用
//joinTable([['%T0.X0%','%T1.X0%'],['%T0.X1%','%T1.X1%']]) //相对引用,前一个数组为第一个公共字段,第二个为第二个公共字段
bdpTable.joinTable(['年份'])
bdpTable.render();

有如下两个表格(数据集),需要放在同一个表格中展示,可解决如数据行数过多,需要横向展示。

表格1:

年份销售额
2016100亿

表格2:

年份销售量
20165000万个

结果表:

年份销售额销售量
2016100亿5000万个

5. 设置表格顺序

  • viewOrder([数据集名称,...,数据集名称])

说明:由于直接拼接和关系拼接均以数据视图默认顺序合并表格,需要自定义时可使用viewOrder调整表格顺序,参数为数据集名称数组。须写在joinTable前。

使用示例:

bdpTable.viewOrder(['表格2','表格1']);
bdpTable.joinTable();
bdpTable.render();

有如下两个表格(数据集),需要放在同一个表格中展示,可解决如数据行数过多,需要横向展示。

表格1:

年份年销售额
2016100亿

表格2:

季度季度销售额
2016Q120亿
2016Q280亿

结果表:

季度季度销售额年份年销售额
2016Q120亿2016100亿
2016Q280亿-

6. 自定义表头

  • render(headMeta)

说明:自定义设置表头内容,如直接拼接和关系拼接的结果表中多层表头可通过数据集的对比或者自定义设置实现。自定义关系拼接必须指定自定义表头表头须与数据列对应,设置表头数量不影响数据列数。

参数:一个由表头对象组成的数组,表头对象中包含表头名称(name)及其子表头(children),子表头用于实现BDP中对比表头类似的多层表头。

使用示例:

var headMeta = [
{
name: "销售年份"
},{
name: "销售总额"
}
];

/* 也可以使用相对引用
var headMeta = [
{
name: "首级表头",
children: [
{
name: "销售年份"
},{
name: "%T0.Y1%" //将引用表格1的第一个数值字段的名称

}
]
}
];
*/

bdpTable.joinTable();
bdpTable.render(headMeta);

有如下两个表格(数据集),需要放在同一个表格中展示,可解决如数据行数过多,需要横向展示。

表格1:

年份年销售额
2016100亿

结果表:

销售年份销售总额
2016100亿

7. 自定义关系拼接

  • customAlaSql(sql)

说明:支持用户使用SQL自定义组装数据集结果,然后利用自定义表头设置标题行,完成表格。可实现如Union的数据纵向合并、选择部分数据列及数据列顺序等各种扩展内容。

参数:SQL语法,其中字段按字段名使用,需要使用中括号,如“[字段1]”;选择不同数据集需要使用“$n”如“$0”代表第一个数据集。

对比:含有对比时饮用字段按照数据集中,表格表头展示出来的顺序从上至下的使用下划线“_”连接而成,如一个对比维度为“城市”含有值“北京”,其数值字段为“人口”,数值在对比维度之后,引用时字段名为“[北京_人口]

数据集结构示例:

[
[//数据集1的数据
{
字段1: A,
字段2: 1
}
],
[//数据集2的数据
{
字段1: B,
字段2: 2
},
{
字段1: C,
字段2: 3
}
]
]

使用示例:

var sql = "select [年份],[销售额] from $0 UNION ALL select [年份],[销售额] from $1"

var headMeta = [
{
name: "销售年份"
},{
name: "销售总额"
}
];

bdpTable.customAlaSql(sql);
bdpTable.render(headMeta);

有如下两个表格(数据集),具有相当维度数据,需要放在同一个表格中竖向展示。

表格1:

年份销售额
2016100亿

表格2:

年份销售额
201580亿

结果表:

销售年份销售总额
2016100亿
201580亿

8. 数值样式及自定义格式化

说明:

  1. 自定义表格时默认使用数据视图中,对应的数据集与字段的格式化效果,一般情况下在数据视图完成数据样式设置即可。
  2. 当表格语法中出现运算、函数及子查询等复杂的SQL语法时,无法判断、获取字段样式,此时用户可以指定数据使用数据集中某字段的样式。
  3. 当使用到SQL数学运算的加减法及使用数值字段排序时,数值字段需要添加数值处理,转化方式为 Number([数值字段1]) + Number([数值字段2])

用法1:自定义指定列样式

对于 IIF([IP] < 10, ' ', [IP])使用了复合语句前一版本无法格式化,当前版本级以后可以在headMeta配置对应位置添加formatterName 字段,值为需要用某个字段的格式化信息进行格式化。

一般是数据集中字段在SQL语句中被引用时的字段名,如果使用了多个数据集作为输入或将数据集重命名为“A”,请使用 “数据集.[字段名]” 或 “A.[字段名]

代码示例:

var sql = "select IIF([IP] < 10, ' ', [IP]),[浏览次数(PV)],IIF([平均访问深度] < 10, ' ', [平均访问深度]),[独立访客(UV)] from $0";

var headMeta = [
{
name: 'IP',
formatterName: '[IP]'
},
{
name: '浏览次数'
},
{
name: '平均访问深度',
formatterName: '[平均访问深度]'
},
{
name: '独立访客'
}
];



bdpTable.customAlaSql(sql);
bdpTable.render(headMeta);

用法2:使用其他列的样式

比如 [独立访客(UV)]这个字段,数据集中已经设置,但我要使用[IP]这个字段的格式化信息进行格式化,那么修改为:

{
name: '独立访客',
formatterName: '[IP]'
}

9. 获取指定单元格内容以及设置指定单元格内容

使用方法:

bdpTable.setCellData([
[2,2, bdpTable.getCellData(1,2)]
]);

放在bdpTable.render()后面执行,需要加减运算时请注意使用Number()数值化处理

示例1:获取某一单元个数据,其中 1指的是第1行,2指的是第2列

1.bdpTable.getCellData(1, 2)

示例2:设置单元格数据, arr是二维数组

2.bdpTable.setCellData(arr)

[
[2,3, bdpTable.getCellData(1,2)]
]

其中:2表示第2行,3表示第2行,bdpTable.getCellData(1,2)表示将第1行第2列获取的数据赋给第2行第2行

10. 指定数值列的空值为自定义内容

默认维度和数值为空的单元格内容均为“”的空字符串,维度显示为空,数值显示为--。在很多情况下,自己不需要--,比如需要显示为0或者 ,在曾经的方案是,sql语句中写IIF语句,这样的语句难免过于复杂。所以新增方法直接指定数值列为空时显示指定字符。

代码示例:

bdpTable.setEmptyValue('需要的字符'); // 必须放在bdpTable.render()前