javascript - 如何在D3上创建默认大小的画笔？

我在理解画笔/范围在D3 4.0上的工作方式时遇到麻烦。我希望创建一个可以沿着svg元素的Y轴拖动的画笔，并且希望在页面加载时已经创建了画笔，我不希望用户必须沿着g元素拖动来创建它。 (例如，此示例具有在页面加载http://bl.ocks.org/raffazizzi/3691274时创建的画笔)。

这是我到目前为止所拥有的:

var verticalRectangle = d3.select(".svgrectangle")
    .attr("width", 100)
    .attr("height", 500)
  .append("g")

var yBrush = d3.brushY()

verticalRectangle.append("g")
  .attr("class", "brush")
  .call(yBrush);

现在，这将创建一个矩形，我可以通过在其中拖动来创建画笔，我希望在加载时已经在矩形上创建了画笔(在矩形的底部，宽度为100，高度为10)。我相信brush.extent()可以用于此目的，但是我不确定在这种情况下正确的参数是什么。许多示例使用D3 3.0，并且使用带有比例尺的画笔，我相信在4.0中将不再需要。感谢您的帮助。

最佳答案

我想出了办法。我必须调用move on brush并建立我希望选择包含的区域。例如 -

var verticalRectangle = d3.select(".svgrectangle")
    .attr("width", 100)
    .attr("height", 500)
  .append("g")

var yBrush = d3.brushY()
  .extent([[0,0], [100,500]]) //Area you want your brush to be movable in
  .on("brush", brushed);

verticalRectangle.append("g")
  .attr("class", "brush")
  .call(yBrush)
  .call(yBrush.move, [5, 100]); //What area you want your brush selection to initially take

关于javascript - 如何在D3上创建默认大小的画笔？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38464807/