图形线不随可缩放图表区域移动

Question

我已经经历了几个d3区块试图把我自己的一个放在一起，我无法弄清楚为什么图形线不会与图形的其余部分一起移动。

这里是我的代码的小提琴：

https://jsfiddle.net/asa1q7tx/1/

我认为问题在于我没有更新“缩放”中的行。功能，但我不知道该怎么做。这里是缩放的＆＃39;来自小提琴的功能：

function zoomed() {
  svg.select(".x.axis").call(xAxis);
  svg.select(".y.axis").call(yAxis);
}

Answer 1

您需要更新缩放功能中的路径。现在，你的tick函数每500ms调用一次就是为你做的，但这并不顺利。

function zoomed() {
  svg.select(".x.axis").call(xAxis);
  svg.select(".y.axis").call(yAxis);
  path.attr('d',line);  // This line updates path
} 

您也可以停止路径的动画并在缩放效果后重新开始。