添加列然后按类别分隔数据

Question

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

• 伦敦：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