无法从 dc.js 数据表中删除空箱答案

【问题标题】：Unable to remove empty bins from dc.js dataTable无法从 dc.js 数据表中删除空箱
【发布时间】：2017-07-11 17:30:48
【问题描述】：

我正在尝试删除空箱，或者我应该说 dc.js 数据表中具有 0 值的行。

我已经根据 dc.js 文档的常见问题解答中提供的示例和 sn-ps 编写了我的代码至 remove empty bins，但我仍然无法获得所需的结果。

我正在尝试使用假组对我的数据进行分组，然后按总金额的降序对表格进行排序。

var data = [{salesman: "AB",name: "John",total: 190.1,type: "Tab"}, 
            {salesman: "CD",name: "David",total: 190,type: "Tab"}, 
            {salesman: "EF",name: "Elton",total: 300.5,type: "Visa"}, 
            {salesman: "AB",name: "John",total: 90.0,type: "Tab"},
            {salesman: "EF",name: "Elton",total: 90,type: "Tab"}, 
            {salesman: "CD",name: "David",total: 90,type: "Tab"}];

var ndx = crossfilter(data);
var salesManDim = ndx.dimension(function(d) {
  return d.salesman;
});
var salesmanSumGroup = salesManDim.group().reduceSum(function(d) {
  return (Math.round((d.total) * 100) / 100);
});
var salesmanChart = dc.pieChart("#chart");
salesmanChart
  .width(200)
  .height(150)
  .slicesCap(10)
  .innerRadius(30)
  .dimension(salesManDim)
  .group(salesmanSumGroup);

var salesMan_TypeDim = ndx.dimension(function(d) {
  return d.salesman + "/" + d.type;
});
var groupedDimension = salesMan_TypeDim.group().reduce(
  function(p, v) {
    p.TOTAL += +(Math.round((v.total) * 100) / 100);
    p.SALESMAN = v.salesman + " - " + v.name;
    p.TYPE = v.type;
    return p;
  },
  function(p, v) {
    p.TOTAL -= +(Math.round((v.total) * 100) / 100);
    p.SALESMAN = v.salesman + " - " + v.name;;
    p.TYPE = v.type;
    return p;
  },
  function() {return { TOTAL: 0, SALESMAN: "",TYPE: ""};});

var rank = function(p) {
  return p.key.substr(p.key.lastIndexOf("/") + 1);
};

function remove_empty_bins(source_group) {
  function non_zero_pred(d) {
    return d.value.TOTAL !== 0;
  }
  return {
    top: function(n) {
      return source_group.top(Infinity).filter(non_zero_pred).slice(0, n);
    }
  };
}
dc.dataTable(".dc-data-table")
  .dimension(remove_empty_bins(groupedDimension))
  .group(rank)
  .size(Infinity)
  .columns([
    function(d) {
      return d.value.SALESMAN;
    },
    function(d) {
      return (Math.round((d.value.TOTAL) * 100) / 100);
    }
  ])
  .sortBy(function(d) {
    return d.value.TOTAL;
  })
  .order(d3.descending);
dc.renderAll();
dc.redrawAll();

当我签入调试器时，删除空箱功能工作正常，但仍然以某种方式未过滤 0 值。是因为我的键的定义方式吗？ To best explain my scenario here is a jsFiddle for the above example

【问题讨论】：

标签： javascript dc.js crossfilter

【解决方案1】：

令人惊讶的是，它出现在如此简单的示例中，但浮点加法和减法通常会导致值不为零，而您所期望的值却不为零。

这种情况尤其经常发生在十进制数字上。 0.1 is unrepresentable in binary floating point numbers, and they are not necessarily associative or distributive.

我们可以添加以下行来诊断问题：

  .on('preRedraw', function(chart) {
       console.log(chart.dimension().top(Infinity).map(x=>x.value.TOTAL));
  })

事实上，当我们点击 CD 时，我们会看到：

[200, 370.3, 2.842170943040401e-14]

所以这样写non_zero_pred：

  function non_zero_pred(d) {
    return Math.abs(d.value.TOTAL) > 0.0001;
  }

零都不见了：https://jsfiddle.net/3fovopxp/7/

我现在就去解决常见问题...

【讨论】：