gpt4 book ai didi

javascript - dc.js 中的 numberDisplay 显示行图表中值的总和

转载 作者:行者123 更新时间:2023-11-29 18:13:39 24 4
gpt4 key购买 nike

我有一个简单的图表,其中只有三个条形。我想使用 dc.numberDisplay() 方法将条形值的总和显示为数字。我得到的只是其中一根柱子的值。重点是根据选择显示总数。例如,我选择 A 和 B,总数将显示 13。这是 jsfiddle我的代码如下:

HTML

<body>
<div id='Chart'>
<h4 id = "total">Number: </h4>
</div>
</body>

JS

var data = [{
Category: "A",
ID: "1"
}, {
Category: "A",
ID: "1"
}, {
Category: "A",
ID: "1"
}, {
Category: "A",
ID: "2"
}, {
Category: "A",
ID: "2"
}, {
Category: "B",
ID: "1"
}, {
Category: "B",
ID: "1"
}, {
Category: "B",
ID: "1"
}, {
Category: "B",
ID: "2"
}, {
Category: "B",
ID: "3"
}, {
Category: "B",
ID: "3"
}, {
Category: "B",
ID: "3"
}, {
Category: "B",
ID: "4"
}, {
Category: "C",
ID: "1"
}, {
Category: "C",
ID: "2"
}, {
Category: "C",
ID: "3"
}, {
Category: "C",
ID: "4"
}, {
Category: "C",
ID: "4"
},{
Category: "C",
ID: "5"
}];

var ndx = crossfilter(data);

var XDimension = ndx.dimension(function (d) {
return d.Category;
});

var YDimension = XDimension.group().reduceCount(function (d) {
return +d.value;
});


dc.rowChart("#Chart")
.width(480).height(300)
.dimension(XDimension)
.group(YDimension)
.label(function (d) {
return d.key + " " + d.value;})
.ordering(function (d) {
return -d.value});

dc.numberDisplay("#total")
.valueAccessor(function(d){return +d.value})
.group(YDimension);

dc.renderAll();

编辑:多亏了戈登,现在显示了正确的总和,但在选择条形图时它并没有改变。现在,致力于此。

最佳答案

为您的 numberDisplay 组使用 XDimension.groupAll(),而不是 YDimension。这是一个特殊的组,只有一个 bin,包含所有过滤后的记录。

https://github.com/square/crossfilter/wiki/API-Reference#dimension_groupAll

关于javascript - dc.js 中的 numberDisplay 显示行图表中值的总和,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25209533/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com