d3线性函数只有当我在线性函数中包含一个伪参数时才起作用.为什么

Question

即使在到达绘图部分之前所有值都正确，下面的代码不断重复错误消息

期望的数字，"；MNaN、NaNLNaN、NaNL…"；。

我的lineRadial函数如下。

var radarLine = d3.lineRadial()
.radius(function(d) {
return rscale(d.value)
})
.angle(function(i) { return i * angleSlice })

我调用这个函数来绘制放射状图，如下所示。

var blobWrapper = g.selectAll(".radarWrapper")
.data(data)
.join('g')
.attr("class", "radarWrapper")
blobWrapper.append('path')
.attr('class', 'radarArea')
.attr('d', function(d) { return radarLine(d); })
.style('fill', function(d, i) { return cfg.color[i] })
.style('fill-opacity', cfg.opacityArea)

我通过在line函数中放入一个伪参数来修复这个错误。

var radarLine = d3.radialLine()
.radius(function(d) {
return rscale(d.value)
})
.angle(function(d, i) { return i * angleSlice })

只要在角度函数中添加"d"参数，它就开始工作了。为什么？

Answer 1

这不是伪参数(或者从回调函数的角度来看是一个参数(。

angle函数的。。。

访问器将为输入数据数组中的每个已定义元素调用，并将元素d、索引i和数组数据作为三个参数传递。(来源(

因此，如果使用。。

angle(function(i) { return i * angleSlice })

i是而不是索引，无论您将其称为i、d、α还是其他什么。所需的索引将始终是第二个参数。

最后，有一个Javascript约定，它说我们使用_来指示未使用该参数。话虽如此，你会有：

angle(function(_, i) { return i * angleSlice }) 

Answer 2

参数的名称并不重要，重要的是它们的顺序。

传递给d3.line或d3.lineRadial访问器函数的第一个参数是要绘制的点，通常标记为d，但使用什么并不重要。

传递的第二个参数是当前点的索引。常规标记为CCD_ 8。

第三个参数是所有点的整个数据数组，很少出现，因此在d3习惯用法中并没有真正的常规名称。

所以，在你的非工作代码中：

.angle(function(i) { return i * angleSlice })

i作为第一个参数，表示数据数组中的一个项，它是一个对象，与常数相乘时不会产生数字。

这就是为什么你需要使用：

.angle(function(d,i) { return i * angleSlice })

因为第二个参数是您要查找的索引。有时您会看到一个下划线用于未使用的参数，而不是使用d。