D3.js Brush＆amp;通过缩放范围的值缩放以重新缩放Y轴

Question

修改此演示时，根据zoome范围的值自动缩放Y轴范围/域的最佳方法是什么？

https://bl.ocks.org/mbostock/34f08d5e11952a80609169b7917d4172

必须有一些 d3-zoom 方法可以完成访问缩放范围的值，但还没有弄清楚它们会是什么......？

Answer 1

我不知道最优雅的方式是什么（直到有人展示它）。但是，这是我的解决方案。

首先，我们根据缩放过滤数据：

var filteredData = data.filter(d=>d.date > x.domain()[0] && d.date < x.domain()[1]);

然后，我们相应地更改y域：

y.domain([0, d3.max(filteredData, function(d) { return d.price; })]);

这是演示，放大和缩小以查看y轴的变化： https://bl.ocks.org/anonymous/raw/9f8c2edcb5950cac61f1bc3873886ec5/

当您放大太多时，此其他版本会避免使用NaN： https://bl.ocks.org/anonymous/raw/56fa7fe37596f753db74fdad58ba6725/

PS：为了访问函数data中的zoomed，我必须移动一些函数（由于范围问题）。