javascript - 在crossfilter dc js中应用除Others之外的多个过滤器

Question

我有一个维度，用户可以在该维度上使用大约 50 个不同的值进行过滤(通过单击与每个过滤器对应的元素)。

显示所有五十个过滤器(元素)是不可能的。 所以我展示了前 5 个过滤器，并使用 dc.js 中的 chart.rowsCap(5) 方法将其余部分放在 Others 中。

用户可以选择多个过滤器，但它也允许选择其他。

我想要的是每当选择其他时，其他过滤器应该被删除，反之亦然。

我尝试了几件事，但到目前为止没有运气。 这是我在 on('filtered', func) 监听器中尝试的

chart.on('filtered', function(chart, filter){
    if(filter instanceof Array){
        if(chart.filters().indexOf("Others") !== -1) {
            chart.filter(null);
            chart.filter(filter);
        }
    } else if(filter == "Others") {
        if(chart.filters().indexOf("Others") !== -1 && chart.filters().length > 1){
            chart.filter(null);
            chart.filter(filter);
        }
    } else {
        if(chart.filters().indexOf("Others") !== -1){
        chart.filter(null);
        chart.filter(filter);
    }
}

感谢任何帮助。

Answer 1

我认为您不想为此使用监听器；听众是被动的，并且在这个过程中处于后期。

相反，我认为您最好的选择是在事件级别控制行为(尽管有一些提议使点击过滤器行为更易于配置)。

尝试这样的事情:

var oc = chart.onClick;
chart.onClick = function(d) { chart.filter(null); oc.call(chart, d); }

这只是在应用另一个过滤器之前清除过滤器，因此它会破坏切换并为您提供单一元素选择。我不确定这是否能回答您的整个问题，但希望它能让您顺利上路。

编辑:这里有一个更复杂的 onClick，它使 Others 与普通切片互斥，但在其他方面保留切换。

chart.onClick = function (d) {
    var had_others = chart.filters().indexOf("Others")>=0;
    if(d.key === "Others") {
        chart.filter(null); 
        if(!had_others)
            oc.call(chart, d); 
        else chart.redrawGroup(); 
     } else { 
         if(had_others) chart.filter(null); 
         oc.call(chart, d); 
     } 
}