使用 reduce 添加删除功能删除空垃圾箱不起作用

Question

我正在寻找使用 reduce Add/Remove 函数时如何删除空垃圾箱的解决方案。

我有一个 jsfiddle here

当我想提供 'Points' 的简单总和时，空箱被移除，但当我想使用平均计算并在图表中使用 valueAccessor 时，则不会。

我的数据设置如下：

{Season:"2016/17",
Manager:"Alan Curtis",
Points:1,
Formation:"4231",
date:"01 February 2017"},

{Season:"2016/17",
Manager:"Paul Clement",
Points:1,
Formation:"442",
date:"01 February 2018"},

{Season:"2015/16",
Manager:"Paul Clement",
Points:3,
Formation:"433",
date:"01 May 2017"},

我的目标是通过 'Manager' 和 'Formation' 提供 'Points Per Game' 平均值。

我正在使用 reduce Add/Remove 函数：

function reduceAdd(p, v) {
    p.total += v.Points;
    ++p.count;
    p.ppg = d3.round((p.total / p.count), 2);
    return p;
    }

function reduceRemove(p, v) {
    p.total -= v.Points;
    --p.count;
    p.ppg = d3.round((p.total / p.count), 2);
    return p;
    }

function reduceInitial() {
    return {
        total: 0,
        count: 0,
        ppg: 0,
        };
    }

和删除空箱代码：

function remove_empty_bins(source_group) {
return {
    all:function () {
        return source_group.all().filter(function(d) {
            return d.value !=0;
        });
    }
};
}

我的图表代码：

managerChart
    .dimension(dimManager)
    .group(ManagerPPGGroup)
    .ordering(function(p) { return -p.value.ppg })
    .renderLabel(false)
    .othersGrouper(null)
    .renderTitle(false)
    .renderTitleLabel(true)
    .margins({top: 10, left: 10, right: 20, bottom: 80})
    .valueAccessor(function(p) 
        { if (p.value.ppg >0) {
        return p.value.ppg } else { return "n/a"}; });

formationChart
    .dimension(dimFormation)
    .group(filteredFormationPPGGroup)
    .ordering(function(p) { return -p.value.ppg })
    .renderLabel(false)
    .cap(10)
    .elasticX(true)
    .renderTitle(false)
    .renderTitleLabel(true)
    .margins({top: 10, left: 10, right: 20, bottom: 80})
    .valueAccessor(function(p) { return p.value.count > 0 ? p.value.ppg : "not used"; });

一切正常，除了在应用过滤器时不会删除空垃圾箱。

我尝试了各种方法来尝试解决问题，更改图表的 valueAccessor 和 remove_empty_bins 函数，但似乎没有任何效果。

我目前的解决方法是在图表上提供 "not used" 文本，以便用户知道经理没有使用编队，但我更愿意按预期删除空箱。

在此先感谢您的帮助。

Answer 1

是的，如果缩减产生的是对象而不是数字，则需要调整 remove_empty_bins。

我想不出任何不会降低效率的通用方法，^* 所以让我们针对这个用例调整函数：

function remove_empty_bins(source_group) {
    return {
        all:function () {
            return source_group.all().filter(function(d) {
                return d.value.total != 0;
            });
        }
    };
}

我们只需要从对象中拉出.total，因为an object (almost) never equals zero.

作为奖励，我还在您的 fiddle:

中将条形图设置为固定高度

formationChart
    .fixedBarHeight(30)

否则当只有一个条时，它会增长以适应整个区域，很多人认为这很丑。

我还对经理行图表应用了过滤。你的 fiddle 分支：https://jsfiddle.net/gordonwoodhull/qw0oe8ea/6/

^* 也许是时候用谓词将其重构为 remove_bins() 了？但在无箭头功能的浏览器消失之前，这不会很简洁。

使用 reduce 添加删除功能删除空垃圾箱不起作用

remove empty bins with reduce Add Remove function not working

dc.js