在 dc.js 中自定义 .y([yScale]) 方法

Question

我正在尝试在 DC.js 中创建条形图。在这里，我减少了一个字段的平均值，并希望在 y 轴上显示它。我不知道该怎么做。有人可以帮我解决这个问题吗？

var dimByChannel = cf.dimension(function(d) { return d.channelUUID; });
var groupByChannel = dimByChannel.group().reduce(reduceAdd, reduceRemove, reduceInitial);

function reduceAdd(p, v) {
    p.bytesTxd = p.bytesTxd + v.bytesTxd;
    p.avg = (p.bytesTxd/total)*100;
    p.count = p.count + 1;
    return p;
}
function reduceRemove(p, v) {
    p.bytesTxd = p.bytesTxd - v.bytesTxd;
    p.avg = (p.bytesTxd/total)*100;
    p.count = p.count - 1;
    return p;
}
function reduceInitial() {
    return {
    bytesTxd: 0,
    avg: 0,
    count: 0
    };
}

我使用 reduceSum() 计算了 total。到现在为止一切都很好。现在如何在 y 轴上显示缩小的 avg？

chanUtil
    .dimension(dimByChannel)
    .group(groupByChannel)
    .x(d3.scale.ordinal().domain(data.map(function (d) { return d.channelUUID; })))
    .xUnits(dc.units.ordinal)
    //.y(d3.scale.linear().domain(data.map(function (d) { return d.avg; })))
    .yAxisLabel("Utilization %");

Answer 1

是的，.y() 的名称相当具有欺骗性（或模糊）：那个是用于比例尺的，它将图表坐标映射到物理坐标。

你要的是.valueAccessor():

.valueAccessor(function(d) { return d.value.avg; })

在 dc.js 中自定义 .y([yScale]) 方法

Customize .y([yScale]) method in dc.js

reduce

crossfilter

dc.js