Using DC.js datatable to create a table with aggregated data by year

I've been trying to use dc.js and crossfilter to both build charts and tables from a certain dataset.

So far building charts works fine, but I want to use the datatable functionality to build a small html table to summarize the data as follows:

|Year|TotalEmployees| 
|2015|555| 
|2016|666| 
|2017|777|

My dataset has around 20 000 rows, here's a sample of the data:

var data = [
{"Year":"2015","Category":"1","NbEmployee":"51"},
{"Year":"2015","Category":"2","NbEmployee":"31"},
{"Year":"2015","Category":"3","NbEmployee":"14"}
{"Year":"2016","Category":"1","NbEmployee":"51"},
{"Year":"2016","Category":"2","NbEmployee":"55"},
{"Year":"2016","Category":"3","NbEmployee":"65"},
{"Year":"2017","Category":"1","NbEmployee":"76"},
{"Year":"2017","Category":"2","NbEmployee":"98"},
];

So far this piece of code returns one row of result per row of data , and although it feels like it should be a simple manipulation, I can't figure out the right syntax to build a summarized table with one row per year:

var ndx = crossfilter(data);
var tableDim = ndx.dimension(function(d) {
    return d.Year;
});

var datatable = dc.dataTable("#dc-data-table");

datatable
    .dimension(tableDim)
    .group(function(d) {
        d.NbEmployee += d.NbEmployee;
        return d.Year;
        })
    .columns([
        function(d) {return d.Year;},
        function(d) {return d.NbEmployee;},
    ]);

I've tried countless times to apply the

.group().reduceSum()

functions to the dimension into a variable and then passing it to the .group() parameter, but I always end up with a compilation error, I'm pretty clueless right now.

The SQL translation of what I'm looking for is this:

SELECT 
    Year,
    NbEmp = SUM(NbEmploye)

FROM DB

GROUP BY
    Year

ORDER BY 
    Year

Thanks in advance for your help!

---

The dataTable 's group is not a group - yes, pretty confusing to use this method to mean something completely different from what it means in all the other charts. Here, it's a function, everywhere else it's a crossfilter object.

The dataTable is unique out of the dc.js charts in that it reads its data from the .dimension() object. This is because it displays the raw rows of data, rather than aggregated data, by default.

However, it can be used to display a group instead. This works because the only method it actually calls on the dimension is .top() , if you choose to display in descending order.

If you want to display in ascending order, you can use a fake group to produce an object which supports the .bottom() method.

链接地址: http://www.djcxy.com/p/32742.html

上一篇: DC.js在折线图中堆叠不显示

下一篇: 使用DC.js数据表按年创建汇总数据表