javascript - d3 在将嵌套数据传递给 d3.stack 时返回错误 `e is not a function`

Question

以下代码从 D3 中抛出错误 e is not a function:

var stack = d3.stack()
    .offset("zero")
    .keys(Object.keys(data[0]))(nest);

下图详细显示了错误:

这是我运行时的错误，错误出现在d3.min.js中。我该如何解决这个问题？

Answer 1

在 d3 的 v3 中，使用 d3.layout.stack()，可以使用字符串提供偏移值:

If offset is specified, sets the stack offset algorithm to the specified value. If offset is not specified, returns the current offset algorithm. The following string values are supported:

silhouette - center the stream, as in ThemeRiver.
wiggle - minimize weighted change in slope.
expand - normalize layers to fill the range [0,1].
zero - use a zero baseline, i.e., the y-axis.

In addition to a string, offset may be specified as a function. (v3 docs)

但是，您正在将 d3v4+ 与 d3.stack() 一起使用。方法名称的更改足以打破旧示例，但方法也更改为仅接受一个函数(或数组)。不能使用字符串值来指定偏移功能:

If offset is specified, sets the offset accessor to the specified function or array and returns this stack generator. If offset is not specified, returns the current offset acccesor, which defaults to stackOffsetNone; this uses a zero baseline. See stack offsets for the built-in offsets. (v5(/4) docs)

因此在您的情况下，您不需要指定偏移量:默认偏移量是零基线。如果你想给 stack.offset() 另一个偏移量，D3 带有 a few开箱即用:

• d3.stackOffsetExpand
• d3.stackOffsetDiverging
• d3.stackOffsetNone
• d3.stackOffsetSilhouette
• d3.stackOffsetWiggle