dc.js-如何从多列创建折线图

use*_*998 3 javascript d3.js crossfilter dc.js

我需要使用来自csv中多个列的输入在dc.js中创建一个行图。所以我需要将一列映射到每一行,并将每一列的总数映射到行值。可能有一个明显的解决方案,但我似乎找不到任何示例。非常感谢S

更新:这是一个快速的草图。为标准“
行图”表示歉意;
第1列----------------- 64(第1
列的总计)第2列------- 35(第2列的总计)第3列
--------- --- 45(第3列的总计)

Gor*_*don 5

有趣的问题!听起来有点像枢轴,这里需要交叉滤镜。使用“伪造的组”和“伪造的尺寸”可以想到一个解决方案,但是有两个警告:

  • 它将反映其他尺寸的过滤器
  • 但是,您将无法单击图表中的行以过滤其他内容(因为它将选择哪些记录?)

伪造的组构造函数如下所示:

function regroup(dim, cols) {
    var _groupAll = dim.groupAll().reduce(
        function(p, v) { // add
            cols.forEach(function(c) {
                p[c] += v[c];
            });
            return p;
        },
        function(p, v) { // remove
            cols.forEach(function(c) {
                p[c] -= v[c];
            });
            return p;
        },
        function() { // init
            var p = {};
            cols.forEach(function(c) {
                p[c] = 0;
            });
            return p;
        });
    return {
        all: function() {
            // or _.pairs, anything to turn the object into an array
            return d3.map(_groupAll.value()).entries();
        }
    };
}
Run Code Online (Sandbox Code Playgroud)

它正在做的是将所有请求的行减少为一个对象,然后将该对象转换为dc.js期望group.all返回的数组格式。

您可以将任意维度传递给此构造函数-索引的内容无关紧要,因为您无法在这些行上进行过滤...但是您可能希望它具有自己的维度,因此它会受到所有其他维度过滤器的影响。还要为该构造函数提供一个您希望将其分成组的列数组,并将结果用作“组”。

例如

var dim = ndx.dimension(function(r) { return r.a; });
var sidewaysGroup = regroup(dim, ['a', 'b', 'c', 'd']);
Run Code Online (Sandbox Code Playgroud)

此处的完整示例:http : //jsfiddle.net/gordonwoodhull/37uET/6/

(请注意,单击图表中的行会导致不良,因为它应该过滤什么?)