Question

我已经对此进行了一段时间的研究，但没有找到我想做的可靠资源。我目前有一个DataTable，它根据用户应用的过滤器（可以是日期，名称等）显示总工作时间以及总工作时间。我要实现的是将总计汇总细分，以进一步显示每个类别工作多少小时。例如（以我做的jsfiddle为例），如果您搜索“ engineer”，那么不仅会显示总金额，还会显示每个办公地点的总金额（忽略项目符号）：

伦敦：295,500美元
旧金山：$ 409,350
新加坡：$ 234,500
东京：$ 139,575
爱丁堡：$ 103,600
纽约：125,250美元
总小时数：$ 1,307,775.00

这是我的求和脚本：

"footerCallback": function (row, start, end, display) {
                var api = this.api(),
                    data;

                // Remove the formatting to get integer data for summation
                var intVal = function (i) {
                    return typeof i === 'string' ?
                        i.replace(/[\$,]/g, '') * 1 :
                        typeof i === 'number' ?
                            i : 0;
                };

                // Total over all pages
                total = api
                    .column(5)
                    .data()
                    .reduce(function (a, b) {
                        return intVal(a) + intVal(b);
                    }, 0);

                // Total over all filtered pages
                if (api.column(5, {
                    search: 'applied'
                }).data().length) {
                    pageTotal = api
                        .column(5, {
                            search: 'applied'
                        })
                        .data()
                        .reduce(function (a, b) {
                            return intVal(a) + intVal(b);
                        });
                } else {
                    pageTotal = 0;
                }

                $(api.column(5).footer()).html(
                    pageTotal.toFixed(2)
                );

                // Update footer
                $(api.column(5).footer()).html(
                    pageTotal.toFixed(2) + ' hours ( ' + total.toFixed(2) + ' total hours)'
                );

这是我的jsfiddle的链接： https://jsfiddle.net/hfyo90w7/

我希望类别是动态的而不是硬编码的，因为我确信对于我正在制作的程序，类别会随着时间的流逝而改变。非常感谢您在此问题上的帮助。

Answer 1

您要减少所有行数据并提取公共值以用作对象键。这是一种非常常见的groupBy模式

按办公室汇总工资的示例：

  var byOffice = api.rows().data().reduce(function(a, c) {
        a[c[2]] = a[c[2]] || 0;
        a[c[2]] += intVal(c[5]);
      return a
    }, {});

这将返回一个对象，该对象的办公室名称为键，薪金总和为值。

然后迭代该对象以创建所需的html

DEMO

添加列，然后按类别分开数据

1 个答案: