Question

我正在尝试使用dc.js创建仪表板，我想自定义数据表的可视化方式。所以我的数据看起来像这样

agegroup    gender  group   scores  total
  18-24       M      1       0.04    1
  45-54       F      2       2.23    13
  25-34       M      1       0.74    6
  25-34       M      2       1.47    8
  18-24       F      1       2.88    7
  35-44       F      2       3.98    14

初始化数据表时，它看起来与我原来的csv相同。但是，如果我想要

 agegroup    gender  group1.scores   group1.total  group2.scores  group2.total
      18-24       M      0.04              1           0.0               0
      18-24       F      2.88              1           0.0               0
      25-34       M      0.74              8           1.47              8
      25-34       F      0.0               0           0.0               0

以下是我初始化和设置数据表的方法

dataTable = dc.dataTable('#data-table');
var tableDim = ndx.dimension(function(d) {
          return d.gender;
        });
      dataTable
            .width(400)
            .height(800)
            .dimension(tableDim)
              .group(function(d){
                return  "Counts"
              })
              .size(20)
            .columns([
                function(d){
                  return d.gender;},
                function(d){
                  return d.agegroup;
                },
                function(d){
                  return d.group;
                },
                function(d){
                  return d.scores;
                },
                function(d){
                  return d.total;
                }, 
            ])
            .order(d3.ascending)
            .sortBy(function(d){
              return d.gender;
            });

我知道crossfilter允许您快速过滤和子集数据，但我不确定它将如何转换数据集。谢谢！

Answer 1

到目前为止，我能够做到这一点。

var tableDim = ndx.dimension(function (d) {
    return d.agegroup;
});

var dataTable = dc.dataTable("#someTable");
dataTable.width(300).height(800)
    .dimension(tableDim)
    .group(function (d) {
    return "Counts";
})
    .columns([
function (d) {
    return d.agegroup;
},
function (d) {
    return d.gender;
},
function (d) {
    if (d.group == 1) return d.scores;
    else return 0;
},
function (d) {
    if (d.group == 1) return d.total;
    else return 0;
},
function (d) {
    if (d.group == 2) return d.scores;
    else return 0;
},
function (d) {
    if (d.group == 2) return d.total;
    else return 0;
}]);

dc.renderAll();

以下是使用上述代码的JSFiddle。当你在SO上要求这样的解决方案时，请使用它或下一次新的。

请记住，使用dc.dataTable可能无法减少数据集中的行数。如果您真的想减少行数，可以尝试group().reduce()方法并为group1.total，group1.scores等创建新字段。

使用crossfilter转换数据集

1 个答案: