D3.js获得意外的过渡效果

我想在d3.jsv4中实现。但得到了意想不到的非连续跃迁效应

经过数小时的试玩，仍然无法找出问题所在

如何获得连续的转换，为什么下面的代码不能按预期工作

我安排了如下过渡：

var transition=d3.transition（）
.持续时间（持续时间）
.ease（d3.easeLinear）；
transition.on（'start'，勾选）
函数tick（）{
//更新域
现在=新日期（）；
x、 域（[现在-（n-2）*持续时间，现在-持续时间]；
y、 域（[0，d3.max（数据）]）；
//将累积计数推回，并重置计数
数据推送（数学最小值（30，计数））；
计数=0；
//重新画线
svg.select（“.line”）
.attr（“d”，行）
.attr（“转换”，null）
//向左滑动x轴
axis.transition（transition.call）（x.axis）
//把线滑到左边
路径.转换（转换）
.attr（“转换”、“平移”（+x（现在-（n-1）*持续时间）+”，0）
d3.激活（此）.transition（转换）.on（'start'，勾选）
//将旧数据点从前面弹出
data.shift（）；
}

完整代码如下：

---

您可以在

勾选（）中定义转换：

：谢谢@GerardoFurtado，您能解释一下为什么将转换放在勾选中吗？看起来直线和轴现在不同步传输。这不是一个解决方案，这就是为什么我写它作为一个评论。这只是为了告诉你为什么口吃。为了找到一个合适的解决方案，你必须重构你的代码。@GerardoFurtado我最终很好地解决了这个问题，但是我仍然不明白为什么我应该在tick中使用另一个转换，我不能在一个转换中安排所有的事情吗？为什么我会口吃？你可以在

tick（）中定义转换：

：谢谢@GerardoFurtado，你能解释一下为什么在tick中放置转换吗？看起来直线和轴现在不同步传输。这不是一个解决方案，这就是为什么我写它作为一个评论。这只是为了告诉你为什么口吃。为了找到一个合适的解决方案，你必须重构你的代码。@GerardoFurtado我最终很好地解决了这个问题，但是我仍然不明白为什么我应该在tick中使用另一个转换，我不能在一个转换中安排所有的事情吗？我为什么口吃？