如何显示总和和计数

Question

使用crossfilter api我创建了一个维度和一个组。我想在直流复合图表中显示每组的计数和每组的总和。但是在左右y轴上它只显示和。

 var data = [
             {"class" : 'class I' , "donation": 400},
             {"class" : 'Class II' , "donation" : 500}];
 var donationCrossfilter = crossfilter(data);
 var classDim = donationCrossfilter.dimension(function(d){ return d.class});
 var classGrp = classDim.group();
 var compositechart = dc.compositeChart("#compositechart");
 compositechart
   .x(d3.scaleBand())
   .xUnits(dc.units.ordinal)
   .margins({top:5 , right:60 , left : 60 , bottom:20})
   .elasticY(true)
   .group(classGrp)
   .dimension(classDim)
   .rightY(d3.scaleLinear())
   .xAxis().tickSize(0);
 compositechart.compose(
         [
          dc.lineChart(compositechart)
            .group(classGrp)
            .valueAccessor(function(d){ return d.value} ),
          dc.barChart(compositechart)
            .group(classGrp.reduceSum(function(d){ return d.donation}))
            .valueAccessor(function(d){ return d.value})
            .useRightYAxis(true)
          ]);

 compositechart.render();

在左边的y轴上，它应该显示每个类的数量为1,1，在右边的y轴上它应该是每个类捐赠的总和为400,500

Answer 1

学习crossfilter时有点令人惊讶：它似乎应该使用编程的功能风格，但API实际上是必不可少的。

因此，当您选择reduceCount或reduceSum时，实际上会更改现有的组对象以使用该缩减，并返回相同的对象。

在您的示例中，sum替换count，两个子图表都显示总和。

要获得两个组，一个计数和一个求和，请执行以下操作：

var classGrpCount = classDim.group().reduceCount();
var classGrpSum = classDim.group().reduceSum(function(d){ return d.donation});
//...
compositechart.compose(
         [
          dc.lineChart(compositechart)
            .group(classGrpCount)
            .valueAccessor(function(d){ return d.value} ),
          dc.barChart(compositechart)
            .group(classGrpSum)
            .valueAccessor(function(d){ return d.value})
            .useRightYAxis(true)
          ]);

我认为这种风格是以效率的名义选择的。由于每个组将继续存在并跟踪对选择的更改，因此您不希望这些功能创建新组。