dc.js/Crossfilter -- 创建具有维度平均值的有序条形图？

Question

带有数据示例的完整 JS fiddle 在这里：https://jsfiddle.net/ojrhn96y/2/ .

我有一些数据有两个值：Achievement 和 Balance。我目前已经创建了两个带有 dc.js 的文本元素，用于跟踪两个值的平均值。但是，我想要一个带有 x 轴 ['Achievement', 'Balance'] 的条形图，然后将 [achievement_sum, balance_sum] 作为其 y 值，每个指标都有一个条形图。

我将如何创建这种类型的条形图？

我有我的平均值，它们是使用类似以下内容创建的：

  achievementAvg = achievement.groupAll().reduceSum(
    function(d) {
      return d.achievement;
    }),

但我不确定如何将这些值中的每一个分配给单独的条。

Answer 1

由于您基本上是在旋转数据，因此 crossfilter 不直接支持该行为，crossfilter 想要过滤和聚合行，而不是列。

但是您可以为此使用 "fake group"，只要您不关心能否按这些类别进行过滤即可。（那是什么意思？不想去想了。）

首先我们需要创建一个完全无用的维度对象，因为 dc.js 想要一个。如果您想出一种过滤这些类别的方法，您可以在此处实施它：

var bogus_dimension = {};

然后是假组，一个实现 all 方法的对象，返回一个 {key,value} 对的数组，就像真正的组一样：

var fake_group = {
    all: function() {
        return [{key: 'Achievement', value: achievementAvg.value()/ndx.size()},
                {key: 'Balance', value: balanceAvg.value()/ndx.size()}];
    }
}

我们用序数刻度初始化条形图：

dc.barChart('#bar-chart')
    .width(200)
    .height(200)
    .dimension(bogus_dimension)
    .group(fake_group)
    .xUnits(dc.units.ordinal)
    .x(d3.scale.ordinal())

这是您的 fiddle 的一个分支，其中包含所有代码：https://jsfiddle.net/gordonwoodhull/x03f37bk/8/

dc.js/Crossfilter -- 创建具有维度平均值的有序条形图？

dc.js/Crossfilter -- Create ordinal bar chart with average values for dimensions?

crossfilter

dc.js