Question

我正在尝试在以下数组中使用dc.numberDisplay来显示总数超过总数的百分比。

var data = [
  {Bool: "True", val: 20},
  {Bool: "True", val: 20},
  {Bool: "True", val: 20},
  {Bool: "False", val: 20},
  {Bool: "False", val: 20}
];

我想要的结果是60％，因为True的总数是60，所有数据的总和是100。

目前，我可以使用以下方法获取值的汇总：

HTML：

<h1 id = "numberDisplay">here</h1>

Javascript：

var ndx = crossfilter(data);
dc.numberDisplay('#numberDisplay')
        .valueAccessor(function(d){return d})
        .group(ndx.groupAll().reduceSum(function(d){return d["val"];}))
        .formatNumber(d3.format(".3s"));
dc.redrawAll();

我也可以使用此

获取值的总和

var ndx = crossfilter(data);

ndxFilter = ndx.dimension(function(d) { return d.Bool; });
ndxFilter.filter('True');


dc.numberDisplay('#numberDisplay')
        .valueAccessor(function(d){return d})
        .group(ndx.groupAll().reduceSum(function(d){return d["val"];}))
        .formatNumber(d3.format(".3s"));
dc.redrawAll();

我很难将这些放在一起以获得百分比。

Answer 1

使用原生javascript我会做这样的事情：

var len = data.length,
    trues = data.filter(function(d){return d.Bool === "True"}).length,
    percentage = trues / len * 100;

document.getElementById('numberDisplay').value = percentage+"%";

如何使用crossfilter和dc.numbedisplay计算和显示百分比？

1 个答案: