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

Question

我一直在检查几个 d3 block ，试图将我自己的一个 block 放在一起，但我无法弄清楚为什么图形线不与图形的其余部分一起移动。

这是我的代码:

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

我认为问题是我没有更新“缩放”函数中的行，但我不知道该怎么做。这是 fiddle 的“缩放”功能:

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

Answer 1

您需要更新缩放功能中的路径。现在，每 500 毫秒调用一次的 tick 函数正在为您执行此操作，但这并不顺利。

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

您不妨停止路径动画并在缩放效果后重新开始。