如何使用d3.js获取parentNode的索引

Question

使用d3.js,我之后(比如说)父节点的某个值x,我会使用:

d3.select(this.parentNode).datum().x

但是,我想要的是数据(即数据)索引.建议？

谢谢!

Answer 1

元素的索引仅在集合中明确定义.当您只选择一个元素时,没有集合,并且没有真正定义索引的概念.例如,您可以创建许多g元素,然后将不同的操作应用于不同(重叠)的子集.任何单个g元素都有多个索引,具体取决于您考虑的子集.

为了完成您要实现的目标,您必须保留对要使用的特定选择的引用.有了这个和标识元素的东西,你就可以做这样的事情.

var value = d3.select(this.parentNode).datum().x;
var index = -1;
selection.each(function(d, i) { if(d.x == value) index = i; });

这依赖于具有唯一标识元素的属性.

如果只有一个选择,则可以将索引另存为另一个数据属性,稍后再访问它.

var gs = d3.selectAll("g").data(data).append("g")
  .each(function(d, i) { d.index = i; });
var something = gs.append(...);
something.each(function() {
  d3.select(this.parentNode).datum().index;
});