d3 selectAll:统计结果
d3 selectAll: count results
如何计算 selectAll 匹配了多少个节点? (没有连接数据)
或者如果有数据,如何统计selection的数据? (假设我已经设置了"data(function...)"所以我不知道长度提前)
我之前这样做的一种方法是通过创建一个新对象将该信息传递到数据函数中。
.data(function(d) {
return d.Objects.map(function(obj) {
return {
Object: obj,
TotalObjects: d.Objects.length
}
});
然后在您使用 Object 的更新部分中仍然有可用的计数。
.attr("x", function(d) {
return d.Object.X;
})
.attr("y", function(d) {
return d.TotalObjects;
})
只需使用d3.selectAll(data).size()
。希望这个例子对你有帮助:
var matrix = [
[11975, 5871, 8916, 2868],
[ 1951, 10048, 2060, 6171],
[ 8010, 16145, 8090, 8045],
[ 1013, 990, 940, 6907]
];
var tr = d3.select("body").append("table").selectAll("tr")
.data(matrix)
.enter().append("tr");
var td = tr.selectAll("td")
.data(function(d) { return d; })
.enter().append("td")
.text(function(d) { return d; });
var tdSize=tr.selectAll("td").size();
完成 jsfiddle here。
要获取数据计数,然后在.selectAll()和.data()之后,在.size()之前似乎需要.enter():
legend_count = legendBoxG.selectAll("legend.box")
.data(curNodesData, (d) -> d.id)
.enter()
.size()
没有 .enter(),结果为 0。.enter() 使其成为 return 数据计数。 (以上代码以咖啡方言显示。)
我需要在向我的 svg 对象添加属性(以便正确缩放它们)之前获取计数 ,而前面示例的 none 就是这样做的。但是,在如上所述将计数剥离到变量后,我似乎无法添加更多属性。因此,虽然上述方法演示了 data() 和 enter() 的操作,但它并不是真正实用的解决方案。我所做的是在执行 selectAll() 之前 获取数据数组本身的长度。我可以最简单地使用数据数组本身的长度 属性(不是函数):
legend_count = curNodesData.length
如果你想方便地从回调函数中获取长度,比如设置元素属性,好像可以从第三个参数中获取,像这样:
node
.attr('some-property', (d, i, a) => {
// d = the individual data point
// i = the index of the data point (0, 1, 2, 3, etc)
// a = the array of data points
// a.length = the size/length of the data points / dataset
return ( some calculation involving a.length or whatever);
});
在我的生活中,我无法在任何地方的 d3 文档中找到这个记录,但我注意到回调函数看起来很像 forEach javascript 函数,所以我采取了在黑暗中拍摄,它奏效了。所以我想,使用后果自负(除非有人能指出我在 d3 中记录的位置)。
如何计算 selectAll 匹配了多少个节点? (没有连接数据)
或者如果有数据,如何统计selection的数据? (假设我已经设置了"data(function...)"所以我不知道长度提前)
我之前这样做的一种方法是通过创建一个新对象将该信息传递到数据函数中。
.data(function(d) {
return d.Objects.map(function(obj) {
return {
Object: obj,
TotalObjects: d.Objects.length
}
});
然后在您使用 Object 的更新部分中仍然有可用的计数。
.attr("x", function(d) {
return d.Object.X;
})
.attr("y", function(d) {
return d.TotalObjects;
})
只需使用d3.selectAll(data).size()
。希望这个例子对你有帮助:
var matrix = [
[11975, 5871, 8916, 2868],
[ 1951, 10048, 2060, 6171],
[ 8010, 16145, 8090, 8045],
[ 1013, 990, 940, 6907]
];
var tr = d3.select("body").append("table").selectAll("tr")
.data(matrix)
.enter().append("tr");
var td = tr.selectAll("td")
.data(function(d) { return d; })
.enter().append("td")
.text(function(d) { return d; });
var tdSize=tr.selectAll("td").size();
完成 jsfiddle here。
要获取数据计数,然后在.selectAll()和.data()之后,在.size()之前似乎需要.enter():
legend_count = legendBoxG.selectAll("legend.box")
.data(curNodesData, (d) -> d.id)
.enter()
.size()
没有 .enter(),结果为 0。.enter() 使其成为 return 数据计数。 (以上代码以咖啡方言显示。)
我需要在向我的 svg 对象添加属性(以便正确缩放它们)之前获取计数 ,而前面示例的 none 就是这样做的。但是,在如上所述将计数剥离到变量后,我似乎无法添加更多属性。因此,虽然上述方法演示了 data() 和 enter() 的操作,但它并不是真正实用的解决方案。我所做的是在执行 selectAll() 之前 获取数据数组本身的长度。我可以最简单地使用数据数组本身的长度 属性(不是函数):
legend_count = curNodesData.length
如果你想方便地从回调函数中获取长度,比如设置元素属性,好像可以从第三个参数中获取,像这样:
node
.attr('some-property', (d, i, a) => {
// d = the individual data point
// i = the index of the data point (0, 1, 2, 3, etc)
// a = the array of data points
// a.length = the size/length of the data points / dataset
return ( some calculation involving a.length or whatever);
});
在我的生活中,我无法在任何地方的 d3 文档中找到这个记录,但我注意到回调函数看起来很像 forEach javascript 函数,所以我采取了在黑暗中拍摄,它奏效了。所以我想,使用后果自负(除非有人能指出我在 d3 中记录的位置)。