我在Dc.Js中有3个类别的条形图
我只想显示每一行的百分比:
/ Construct the charts
xdata = crossfilter(data);
runDimension = ndx.dimension(function(d) {return "run-"+d.Run;})
speedSumGroup = runDimension.group().reduceSum(function(d) {return d.Speed * d.Run;});
var all = xdata.groupAll();
dataCount.dimension(xdata)
.group(all);
// Define the crossfilter dimensions
cities = xdata.dimension(function (d) { return d.City; });
locations = xdata.dimension(function (d) { return d.all; });
var districttype = xdata.dimension(function (d) { return d.zip; });
var wardTypes = xdata.dimension(function (d) { return d.ward; });
var coordinates = xdata.dimension(function(d) { return d.geo; });
var type = xdata.dimension(function(d) { return d.type; });
// Marker Chart
typeChart.width($('#type-chart').innerWidth()-30)
.height(250)
.colors(commonChartBarColor)
.margins({top: 10, left: 20, right: 10, bottom: 20})
.group(type.group())
.dimension(type)
.elasticX(true)
.on("filtered", onFilt)
.label(function (d) {
return d.data.key + "(" + Math.floor(d.data.value / all.value() * 100) + "%)";
});
我已经尝试了标签功能,但是无法正常工作。
错误:无法获取未定义或空引用的属性“键”
我该怎么做?
解决方案:
typeChart.width($('#type-chart').innerWidth()-30)
.height(250)
.colors(commonChartBarColor)
.margins({top: 10, left: 20, right: 10, bottom: 20})
.group(type.group())
.dimension(type)
.elasticX(true)
.ordering(function(d) {
return -d.value
})
.label(function (d) {
if (typeChart.hasFilter() && !typeChart.hasFilter(d.key))
return d.key + " (0%)";
var label = d.key;
if(all.value())
label += " (" + Math.floor(d.value / all.value() * 100) + "%)";
return label;
})
.xAxis().ticks(5);