Javascript 如何使用交叉滤波器和dc.NumberDisplay计算和显示百分比？

我试图在下面的数组中使用dc.numberDisplay来显示Trues总数占总数的百分比

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

我想要的结果是60%，因为真实的总数是60，所有数据的总数是100

目前，我可以使用以下方法获得值的聚合：

HTML:

我也可以通过这个函数得到值的和

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();

---

我很难把这些放在一起得到一个百分比

使用本机javascript，我可以执行以下操作：

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

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

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();

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

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