使用d3动态更新一条线使线条来回移动

Question

我有实时数据，我需要在折线图中显示。所以我正在使用（每秒执行此操作）更新路径

svg.select(".strream").data([streamData]).interrupt().transition()
            .duration(1000)
            .ease("linear").attr("d", StepAfterLine)

这使我的图表移动得更顺畅，但我想删除数组中的旧数据。所以我在比较时间并删除旧数据，令人惊讶的是它让我的图表来回移动。任何人都可以帮助我，如果我从数组中删除旧数据，为什么行的移动方式不同？

Answer 1

我得到了回答我的问题。在上面的代码中我是动画线。而是应用动画进行转换。

svg.select(".strream").data([strreamDataArray])
        .attr("transform", "translate(0,10)")
        .attr("d", realStepAfterLine)
        .interrupt().transition().ease("linear")
        .duration(1000)
        .attr("transform", "translate(xscale(0))");