PivotTable.js 是 JavaScript Pivo 表格 (又称为 Pivot网格,Pivot 图标,交叉表) 库,通过数据可以自定义展示想要的数据,相对还是非常的方便的。

github地址:

  • https://github.com/nicolaskruchten/pivottable

使用说明:
pivottable使用方式分为两种,一种是为简易形式的pivot()、一种是带图形的pivotUI()。
pivot依赖Jquery、可以自定义rows和cols的选择框、比较适合有固定需求界面的项目。
pivotUI在pivot的基础上新增了依赖JqueryUI、多了系统定义好的rows和cols,比较适合自我展示的项目。

请求示例:

$("#output").pivot(
    data,
    {
        rows: rowList,
        cols: columnList,
        aggregator: aggregatorName,
        rendererOptions: {
            table: {
                rowTotals: _this.totalStauts.row,
                colTotals: _this.totalStauts.column,
                local: 'zh',
                localList: _this.localList,
                tableLocalList: _this.tableLocalList
            }
        }
    }
);


请求参数说明:

参数名类型说明
dataarray数据
rowsarray横向条件
colsarray列项条件
aggregatorfunction请求方法
rendererOptionsobject表格配置
rendererOptions.tableobject表格配置(可以自定义一些参数在里面,后修改原JS可以达到一些效果,比如我的示例中,我将字段的翻译元素给加入了进去)
rendererOptions.table.rowTotalsboolean横向统计开关
rendererOptions.table.rowTotalsboolean纵向统计开关



aggregator参数说明:
aggregator的使用方法如下:

const type = 'Count'
const aggregatorName= $.pivotUtilities.aggregators[type];



type数据类型:

参数名说明值数量
Count计数无需值
Count Unique Values计算唯一值未知(待使用)
List Unique Values列出唯一值未知(待使用)
Sum一个值
Integer Sum整数和未知(待使用)
Average平均未知(待使用)
Median中位数未知(待使用)
Sample Variance样本差异未知(待使用)
Sample Standard Deviation样本标准偏差未知(待使用)
Minimum最低要求未知(待使用)
Maximum最大值未知(待使用)
First第一未知(待使用)
Last持续未知(待使用)
Sum over Sum总和未知(待使用)
80% Upper Bound80%上限未知(待使用)
80% Lower Bound下限80%未知(待使用)
Sum as Fraction of Total总和的分数未知(待使用)
Sum as Fraction of Rows行总和未知(待使用)
Sum as Fraction of Columns列总和未知(待使用)
Count as Fraction of Total计为总计的分数未知(待使用)
Count as Fraction of Rows计算为行的分数未知(待使用)
Count as Fraction of Columns计为列的分数未知(待使用)