D3.js 为什么d3匿名函数中的第三个变量在转换时未定义？

假设我们有一些测试数据

var testdata1 = [
[
  {x: 1, y: 40},
  {x: 2, y: 43},
  {x: 3, y: 12},
  {x: 4, y: 60},
  {x: 5, y: 63},
  {x: 6, y: 23}
], [
  {x: 1, y: 12},
  {x: 2, y: 5},
  {x: 3, y: 23},
  {x: 4, y: 18},
  {x: 5, y: 73},
  {x: 6, y: 27}
], [
  {x: 1, y: 60},
  {x: 2, y: 49},
  {x: 3, y: 16},
  {x: 4, y: 20},
  {x: 5, y: 92},
  {x: 6, y: 20}
 ] 
];

我们将数据绑定到一些嵌套对象，比如

var circles = svg.select("circle")
    .data(testdata1)
    .enter()
    .append("circle")
var subsel = circles.selectAll("rect")
    .data(function(d) {return d})
    .enter()
    .append("rect")

d3匿名函数中的第三个变量保存父数据元素的索引（如中所述）

在添加转换之前，j变量的行为与预期的一样（每组6个元素的值为0,1,2）

但是，在转换之后，j变量变得未定义：

subsel.attr("foobar", function(d,i,j) {console.log(d,i,j)})
    .transition()
    .attr("foobar", function(d,i,j) {console.log(d,i,j)})   

---

发生什么事了

第三个变量在转换后不会变得未定义。你可以很容易地在这个小提琴中检查它：

我将

console.log

更改为显示“之前”和“之后”：

它按预期显示父索引：

after: x=1 y=40 i=0 j=0
after: x=2 y=43 i=1 j=0
after: x=3 y=12 i=2 j=0
after: x=4 y=60 i=3 j=0
after: x=5 y=63 i=4 j=0
after: x=6 y=23 i=5 j=0
after: x=1 y=12 i=0 j=1
etc...

---

我试图复制这种行为，逐字复制您的代码，但我仍然得到

j

的值，谢谢。当我尝试你的代码时，我仍然没有定义，但我尝试了一些东西，并意识到我链接到的d3版本是一个旧版本。这就是问题的根源。版本是什么？我被链接到了。我刚才从其他例子中复制了它。

after: x=1 y=40 i=0 j=0
after: x=2 y=43 i=1 j=0
after: x=3 y=12 i=2 j=0
after: x=4 y=60 i=3 j=0
after: x=5 y=63 i=4 j=0
after: x=6 y=23 i=5 j=0
after: x=1 y=12 i=0 j=1
etc...