javascript - 无法从 dc.js 数据表中删除空箱

标签 javascript dc.js crossfilter

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

我已经根据 dc.js 文档常见问题解答中提供的示例和片段编写了我的代码 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();

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

最佳答案

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

这种情况尤其经常发生在十进制数上。 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/

我现在去解决FAQ...

关于javascript - 无法从 dc.js 数据表中删除空箱,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45041136/

相关文章:

javascript - 如何根据条件 append 指令

Javascript 使用each() 返回复选框的正确值

javascript - 前置摄像头不自动对焦或手动对焦

javascript - 过滤到较窄范围时 dc.js 条形图上的颜色问题

javascript - 在 dc.js HeatMap 中正确旋转和对齐 X 轴文本

javascript - 使用多数组通过 dc.js、d3 和 crossfilter 在散点图上绘制数据

javascript - 如何在 D3 中使用交叉过滤器进行过滤

d3.js - 从另一个数据集在 dc.js 中添加过滤器

javascript - 如何用大括号包裹 json 的值?

javascript - 在 dc js 中创建堆叠条形图