Question

完整的JS小提示数据示例在这里：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不直接支持这种行为，它希望过滤和聚合行，而不是列。

但您可以使用short-circuit evaluation，只要您不关心是否可以按这些类别进行过滤。（这意味着什么？我不想考虑它。）

首先，我们需要创建一个完全无用的维度对象，因为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())

这是你的小提琴，包含所有代码："fake group"

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

1 个答案: