我正在尝试计算并绘制一个dc图表中的百分比(%)。
我已阅读API和有关reduce函数的多个示例(添加,删除和初始化等) 我提到1st&我的代码2nd。
我想计算衰减百分比(sum(decay_data)/ sum(all_data); decay_data在数据中定义为“decay_ind == 1”)
由于某些问题,我仍然没有在图表中获得任何内容,也使用了值访问器但是,可能存在一些问题。
在代码中,请仅查看“percentgroup”和“datedimension”,其他则用于单独的图表。
到目前为止我的代码:
var chart = dc.pieChart("#test");
var chart2 = dc.barChart("#test2");
var chart3 = dc.barChart("#test3");
console.log(data[0]);
//Filtering only target population
data = data.filter(function (d) { return d.target_ind == "1"; });
var ndx = crossfilter(data);
bucketDimension = ndx.dimension(function(d) {return "Bucket : " +d.decay_bucket;});
speedSumGroup = bucketDimension.group().reduceSum( function(d) { return d.Count ;});
dateDimension = ndx.dimension(function(d) {return d.duration ;});
rechGroup = dateDimension.group().reduceSum ( function(d) { return d.recharge_revenue ;});
var percentGroup = dateDimension.group().reduce(
//add
function(p, v) {
++p.count;
p.decay += (v.decay_ind === '1' ? p.recharge_revenue : 0);
p.total += p.recharge_revenue;
p.percent = p.count ? p.decay/p.total : 0;
return p;
},
function(p, v) {
--p.count;
p.decay -= (v.decay_ind === '1' ? p.recharge_revenue : 0);
p.total -= p.recharge_revenue;
p.percent = p.count ? p.decay/p.total : 0;
return p;
},
function() {
return {
count: 0,
decay : 0,
total : 0,
percent : 0
};
}
);
chart3
.width(768)
.height(480)
.x(d3.scale.ordinal())
.xUnits(dc.units.ordinal)
//.brushOn(false)
.yAxisLabel("Decay %")
.dimension(dateDimension)
//.group(decayGroup)
.on('renderlet', function(chart) {
chart.selectAll('rect').on("click", function(d) {
console.log("click!", d);
});
});
chart3.valueAccessor(function (p) {
return p.value.percent;
})
.group(percentGroup);
我在这里想念的是什么? 任何方法/建议都会非常有用。
更新
好的,我已经纠正了一些错误,现在,只是试着让总和更好地理解这些功能并在控制台中看到它们。同时添加了持续时间维度中的所有值。
我总结了一个名为“Recharge revenue”的变量,在控制台中 - add函数给出了随机/垃圾值。删除功能给我无限。
我的新代码:
var percentGroup = dateDimension.group().reduce(
//add
function(p, v) {
++p.count;
p.total += v.recharge_revenue;
//p.percent = p.count ? p.decay/p.total : 0;
console.log(p.total);
return p;
},
//remove
function(p, v) {
--p.count;
p.total -= v.recharge_revenue;
return p;
},
//init
function() {
return {
count: 0,
total : 0,
};
}
);
chart3
.width(768)
.height(480)
.x(d3.scale.ordinal())
.xUnits(dc.units.ordinal)
//.brushOn(false)
.yAxisLabel("Decay %")
.dimension(dateDimension)
.valueAccessor(function (p) {
return p.value.total;
})
.group(percentGroup)
.on('renderlet', function(chart) {
chart.selectAll('rect').on("click", function(d) {
console.log("click!", d);
});
});
由于显而易见的原因(控制台显示),图表仍为空
请帮我解决这个问题,我不知道这里有什么问题。一旦完成总和,我想计算百分比。
另一个警告:我的数据集(csv)中有一个“Count”列,是不是有机会导致问题? (改为其他名称,仍然无效)
基本上,唯一可行的是图中的 count ,如果我使用任何总和,平均值,我会得到随机值而没有图表。
欢迎任何建议/反馈。
更新2:
这是fiddle
数据集有两个存储桶和两个持续时间
显示总数和平均值的垃圾/随机值。请帮我解决这个问题。
答案 0 :(得分:0)
数字是字符串格式,必须解析成整数才能读取它们的函数,这些值在连接它们时是垃圾。
解决方案代码:
function(p, v) {
++p.count;
p.total += parseInt(v.recharge_revenue);
//p.percent = p.count ? p.decay/p.total : 0;
console.log(p.total);
return p;
},
//remove
function(p, v) {
--p.count;
p.total -= parseInt(v.recharge_revenue);
return p;
}