D3.js 在无限规模上使用 d3.svg.brush

Question

我正在使用 d3.js，我想在我的整个 svg 画布上使用画笔（支持缩放和平移），所以我只是在线性比例中放置了一个无穷大范围，如下所示：

d3.svg.brush()
    .x(d3.scale.linear().range([-Infinity, Infinity]))
    .y(d3.scale.linear().range([-Infinity, Infinity]))
    ...()

刷子在整个 sv 上工作，但是在使用这个“技巧”时会出现一些令人讨厌的 javascript 错误

Invalid value for <rect> attribute x="NaN"

工作示例：http://jsfiddle.net/cn010zt3/

知道如何正确执行此操作吗？

Answer 1

D3 刻度需要实际值，不能与Infinity 一起正常工作。无论如何，您都不需要使用Infinity，因为您的 SVG 大小有限——只需使用它即可。完成演示here。