Javascript 使用「；我"；在d3.js中的函数（d，i）中

谁能解释一下“i”的用法吗。我理解x，y，宽度和高度。我也知道我是一个索引，但它到底做什么呢？如果我把我的例子改成I*2或I*10，矩形变得越来越宽，但仍然是单一的，I*21或I*42将它分成多个矩形

//D3在这下面

            var dataset = [ 5, 10, 13, 19, 21, 25, 22, 18, 15, 13,
                11, 12, 15, 20, 18, 17, 16, 18, 23, 25 ];



            var w = 500;
            var h = 100;

           var svg = d3.select("body")
               .append("svg")
               .attr("width", w)
               .attr("height", h)

           svg.selectAll("rect")
               .data(dataset)
               .enter()
               .append("rect")
               .text(function(d){
                   return d;
               })
               .attr("x", function(d, i){
                   return i * 21;
               })
               .attr("y", 0)
               .attr("width", 20)
               .attr("height", 100)




        </script>

var数据集=[5,10,13,19,21,25,22,18,15,13，
11, 12, 15, 20, 18, 17, 16, 18, 23, 25 ];
var w=500；
var h=100；
var svg=d3.选择（“主体”）
.append（“svg”）
.attr（“宽度”，w）
.attr（“高度”，h）
svg.selectAll（“rect”）
.数据（数据集）
.输入（）
.append（“rect”）
.文本（功能（d）{
返回d；
})
.attr（“x”，函数（d，i）{
返回i*21；
})
.attr（“y”，0）
.attr（“宽度”，20）
.attr（“高度”，100）

第二个参数，传统上称为

i

，是元素的

索引

例如：


var foo=d3.select（“body”）.selectAll（null）
.数据（[“foo”、“bar”、“baz”]）
.输入（）
.append（“foo”）
.每个（功能（d，i）{
日志（“数据”+d+“具有索引”+i）
})
如果我将示例更改为I*2或I*10，矩形只是变宽了，但仍然是单一的，则I*21生成或I*42将其划分为多个矩形。我不明白。如何使用索引并使我的矩形变宽，将其划分为多个矩形。我正在浏览斯科特·默里的书，需要一些帮助来理解它的用法。这里的概念与javascript中的for循环不同……一如既往，这是一个很好的答案！我佩服你的耐心！加上我的学究糖：
i
是所选元素的索引，而不是数据的索引，对吗？如果没有数据绑定，你甚至可以得到索引。@altocumulus是的，你总是对的，我认为这样（“数据的索引”）会更容易让OP理解。我刚刚编辑了它。我的回答中还有其他的简化。例如，为了添加我的学究糖，
i
是参数的名称，而不是参数。相反，除非您使用的是简化版本，否则参数和参数都被命名为
i
：；-）是的，但我在用户代码中的意思是：value函数中的
I
在技术上是一个参数，而不是参数，用户可以随意命名。