javascript - d3 v4 刷区错误 : attribute x: Expected length, "NaN"

Question

我正在尝试遵循这个例子:http://bl.ocks.org/mbostock/34f08d5e11952a80609169b7917d4172

我认为问题出在 brushX 的范围设置上，随后出现矩形覆盖和选择错误。

这是我的代码，几乎是从示例中复制过来的:

var brush = d3.brushX()
                .extent([0,0],[brushChart.width,brushChart.height])
                .on("brush end",brushed);
context = svg.append("g")
                    .attr("class", "context")
                    .attr("transform", "translate(" + brushMargin.left + "," + brushMargin.top + ")");
context.append("g")
                    .attr("class", "brush")
                    .call(brush) //this throws errors

错误在行“call(brush):

我已经尝试选择矩形并添加值，如 this example .

Answer 1

您的画笔初始化包含一个错误。调用brush.extent()时您需要指定点的数组，即数组数组(嵌套数组):

# brush.extent([extent]) <>

If extent is specified, sets the brushable extent to the specified array of points [[x0, y0], [x1, y1]]

因此，你的初始化变成了

var brush = d3.brushX()
                .extent([[0,0],[brushChart.width,brushChart.height]]) // [[x0,y0], [x1,y1]]
                .on("brush end",brushed);