Crossfilter 维度和组以过滤掉低于特定阈值的数据
Crossfilter dimension and group to filter out data below certain threshold
我有以下数据,我正在尝试绘制 2 个条形图:
- 给定类型的总单位数
- 低于 2.0 版的单位
两个图表中的 x 轴都是单位类型。
图表很好。问题是:
当我 select 第二个图表上的条形图时,我希望在数据 table 和第一个图表中只看到版本 < 2.0 的单位,即在这种情况下的一条记录。但我得到的是该特定类型的所有单位(如果我单击第一个图表中的条形图,这是我所期望的),即 3 条记录。
见http://jsfiddle.net/y1o52tk4/6/
我猜问题出在我如何对版本图表进行分组:
var versionGroup = type1Dim.group().reduceSum(dc.pluck('version_count'));
数据:
var data = [{
"version": 1.0,
"serial": '1A',
"type": "a"
},{
"version": 2.0,
"serial": '2A',
"type": "a"
},{
"version": 2.0,
"serial": '2AA',
"type": "a"
},{
"version": 2.0,
"serial": '2B',
"type": "b"
},{
"version": 2.5,
"serial": '25B',
"type": "b"
},{
"version": 1.0,
"serial": '1B',
"type": "b"
}];
这里的问题是您创建了小于 2 个版本的自定义计数并将其绘制在您的条形图中。 Crossfilter 不知道反方向指的是什么。因此,当您单击区域 'b' 中的第二个图表时,crossfilter 将 .filter("b") 应用于该维度,然后应用于 crossfilter 对象。因此你的输出是正确的。做你想做的事我建议添加一个新维度
var versionDim = ndx.dimension(function(d) {return d.version});
然后向您的第二个图表添加一个 onfiltered 侦听器
此侦听器会检查您是否尝试过滤第二个图表,如果是,则对我在上面创建的新维度应用过滤器。
.on("filtered", function(chart){
if(typeDim.top(ndx.size()).length) < ndx.size())
{
versionDim.filter(1);
}else{
versionDim.filterAll();
}
})
如上面的评论所述,但让我们把它拼出来并澄清一些事情。
您可以使用复合键,然后使用 "fake group" 过滤组,就像您在上面更新的 fiddle 中所做的那样,以获得这种效果。这可能是最通用和最稳定的方法,无需进行任何 UI hack。
然而,关于交叉过滤器键的理解是,它总是将它们强制转换为值。所以如果你想要一个复合键,最好自己将它构造为一个字符串,因为如果你将它作为一个数组传递,crossfilter 会将它强制转换为一个字符串并给你一个与 ,
的连接 - 这可以可以工作,我知道 dc.js 散点图可以做到这一点,但我不推荐这样做。它比自己创建字符串效率低(因为你只会做一次而不是在 crossfilter 内部发生),而且因为你有更多的控制权。
这是与 Jason Davies 的长时间讨论,它说服了我:
https://github.com/square/crossfilter/pull/48
这是您的 fiddle.
的字符串连接复合键版本
首先是复合键:
var type1Dim = ndx.dimension(function(d){
if(d.version<2.0)
return '1.' + d.type;
else
return '2.' + d.type;});
(最简单的分隔符是 '\x0'
但 '.'
在这里工作正常。)
接下来,一个简单的密钥访问器:
.keyAccessor(function(d) {return d.key;})
我们也让 dc.js 推断序数尺度的域:
.x(d3.scale.ordinal());
它有效,但现在滴答声有丑陋的复合键。要解决这个问题:
versionChart.xAxis().tickFormat(function(d) {
return d.split('.')[1];
});
我的叉子:http://jsfiddle.net/gordonwoodhull/y09cok1z/4/
编辑:我忘了更新假组生成器,这在这里并不重要,但一般来说,它也应该拆分密钥:
function removeVersion2(source_group) {
return {
all:function () {
return source_group.all().filter(function(d) {
return d.key.split('.')[0] != 2;
});
}
};
}
我有以下数据,我正在尝试绘制 2 个条形图:
- 给定类型的总单位数
- 低于 2.0 版的单位
两个图表中的 x 轴都是单位类型。
图表很好。问题是:
当我 select 第二个图表上的条形图时,我希望在数据 table 和第一个图表中只看到版本 < 2.0 的单位,即在这种情况下的一条记录。但我得到的是该特定类型的所有单位(如果我单击第一个图表中的条形图,这是我所期望的),即 3 条记录。
见http://jsfiddle.net/y1o52tk4/6/
我猜问题出在我如何对版本图表进行分组:
var versionGroup = type1Dim.group().reduceSum(dc.pluck('version_count'));
数据:
var data = [{
"version": 1.0,
"serial": '1A',
"type": "a"
},{
"version": 2.0,
"serial": '2A',
"type": "a"
},{
"version": 2.0,
"serial": '2AA',
"type": "a"
},{
"version": 2.0,
"serial": '2B',
"type": "b"
},{
"version": 2.5,
"serial": '25B',
"type": "b"
},{
"version": 1.0,
"serial": '1B',
"type": "b"
}];
这里的问题是您创建了小于 2 个版本的自定义计数并将其绘制在您的条形图中。 Crossfilter 不知道反方向指的是什么。因此,当您单击区域 'b' 中的第二个图表时,crossfilter 将 .filter("b") 应用于该维度,然后应用于 crossfilter 对象。因此你的输出是正确的。做你想做的事我建议添加一个新维度
var versionDim = ndx.dimension(function(d) {return d.version});
然后向您的第二个图表添加一个 onfiltered 侦听器 此侦听器会检查您是否尝试过滤第二个图表,如果是,则对我在上面创建的新维度应用过滤器。
.on("filtered", function(chart){
if(typeDim.top(ndx.size()).length) < ndx.size())
{
versionDim.filter(1);
}else{
versionDim.filterAll();
}
})
如上面的评论所述,但让我们把它拼出来并澄清一些事情。
您可以使用复合键,然后使用 "fake group" 过滤组,就像您在上面更新的 fiddle 中所做的那样,以获得这种效果。这可能是最通用和最稳定的方法,无需进行任何 UI hack。
然而,关于交叉过滤器键的理解是,它总是将它们强制转换为值。所以如果你想要一个复合键,最好自己将它构造为一个字符串,因为如果你将它作为一个数组传递,crossfilter 会将它强制转换为一个字符串并给你一个与 ,
的连接 - 这可以可以工作,我知道 dc.js 散点图可以做到这一点,但我不推荐这样做。它比自己创建字符串效率低(因为你只会做一次而不是在 crossfilter 内部发生),而且因为你有更多的控制权。
这是与 Jason Davies 的长时间讨论,它说服了我: https://github.com/square/crossfilter/pull/48
这是您的 fiddle.
的字符串连接复合键版本首先是复合键:
var type1Dim = ndx.dimension(function(d){
if(d.version<2.0)
return '1.' + d.type;
else
return '2.' + d.type;});
(最简单的分隔符是 '\x0'
但 '.'
在这里工作正常。)
接下来,一个简单的密钥访问器:
.keyAccessor(function(d) {return d.key;})
我们也让 dc.js 推断序数尺度的域:
.x(d3.scale.ordinal());
它有效,但现在滴答声有丑陋的复合键。要解决这个问题:
versionChart.xAxis().tickFormat(function(d) {
return d.split('.')[1];
});
我的叉子:http://jsfiddle.net/gordonwoodhull/y09cok1z/4/
编辑:我忘了更新假组生成器,这在这里并不重要,但一般来说,它也应该拆分密钥:
function removeVersion2(source_group) {
return {
all:function () {
return source_group.all().filter(function(d) {
return d.key.split('.')[0] != 2;
});
}
};
}