交叉过滤器堆积的条形图取反值

Question

我正在使用带有dcv3的crossfilter2

我的数据在我加载到内存的csv中

原始数据

Day, ID
1, 2
1, 2
1, 2
2, 5
3, 6
4, 6 

处理过的数据

Day, ID, target
1, 2, True
1, 2, True
1, 2, True
2, 5, False
3, 6, False
4, 6, False 

当前，我要执行的操作是创建一个带有2条的交叉过滤器stackedbar条形图。如果是ID == 2，我将其视为一个组，而将ID !=2视为另一组。但是，我无法在DC /交叉滤波器中动态地执行此操作，这导致我不得不对数据进行预处理以添加新列并按下面的解决方案所示处理该列。

有更好的方法吗？

var dimID = ndx.dimension(function(d) { return d.day; });

var id_stacked = dimID.group().reduce(
function reduceAdd(p, v) {
    p[v.target] = (p[v.target] || 0) + 1;
    return p;
},
function reduceRemove(p, v) {
    p[v.target] = (p[v.target] || 0) - 1;
    return p;
},
function reduceInitial() {
    return {};
    });

//Doing the stacked bar chart here
stackedBarChart.width(1500)
.height(150)
.margins({top: 10, right: 10, bottom: 50, left: 40})
.dimension(dimID)
.group(id_stacked, 'Others', sel_stack("True"))
.stack(id_stacked, 'Eeid of interest', sel_stack("False"))

这是我的sel_stack函数

function sel_stack(i) {
    return function(d) {
        return d.value[i] ? d.value[i] : 0;

    };
}

我正在绘制条形图，其中x轴为日期，Y轴为频率ID == 2或ID!=2在堆叠的条形图中

Answer 1

因此，您要按天分组，然后按是否ID===2进行堆叠。尽管dc.js可以接受许多不同的格式，但通常的窍门是使数据具有正确的形状。

您处在正确的轨道上，但是不需要额外的列即可为“ is 2”和“ not 2”创建堆栈。您可以直接进行计算：

var dayDimension = ndx.dimension(function(d) { return d.Day; }),
    idStackGroup = dayDimension.group().reduce(
        function add(p, v) {
            ++p[v.ID===2 ? 'is2' : 'not2'];
            return p;
        },
        function remove(p, v) {
            --p[v.ID===2 ? 'is2' : 'not2'];
            return p;
        },
        function init() {
              return {is2: 0, not2: 0};
        });

这些是标准的添加/删除功能，用于减少每个bin的多个值。您会发现other variations where the name of the field is driven by the data。但是这里我们知道将存在哪些字段，因此我们可以在init中将它们初始化为零，而不必担心遇到新字段。

在将行添加到交叉过滤器中或更改过滤器以包括一行时，将调用add函数；每当从交叉过滤器中过滤出一行或从中删除一行时，都会调用remove函数。由于我们不担心undefined ^（1），因此我们可以简单地增加（++）和减少（--）值。

最后，我们需要访问器将这些值拉出对象。我认为将堆栈访问器置于行内比较简单-sel_stack是为添加动态数量的堆栈而编写的。 （YMMV）

  .group(idStackGroup, 'Others', d => d.value.not2)
  .stack(idStackGroup, 'Eeid of interest', d => d.value.is2);

https://jsfiddle.net/gordonwoodhull/fu4w96Lh/23/

^（1）如果对undefined进行任何算术运算，它将转换为NaN，而NaN会破坏所有进一步的计算。