javascript - 如何在c3js动态图表上实现平滑(水平)过渡

Question

我开始玩c3js，希望得到一个好看的动态图表。在测试它时，我注意到每个 load 函数之间的转换似乎没有任何类型的转换。我还尝试使用 flow 函数，但得到了相同的结果。我找不到有关此主题的任何内容，但基本上有没有办法改变这种行为并在新数据点出现时实现平滑过渡？

您可以在这里查看我的示例:

        transition: {
            duration: 0
        },

https://jsfiddle.net/g4cq6pg0/1/

当我实际启用转换时，它运行良好(水平)，直到我开始删除一些数据以添加新指标，然后事情就会向南发展。它不仅水平过渡，还垂直过渡，这使得事情很难看(350 是默认值):

        transition: {
            duration: 350
        },

https://jsfiddle.net/g4cq6pg0/2/

我怎样才能只强制平滑的水平过渡？以下是我的意思的示例(仅使用 D3):

http://bl.ocks.org/simenbrekken/6634070

Answer 1

是的，线在移动，但点只是垂直上下 float 以适应当前值，而不是随着线移动......

看看这里的问题 --> Dynamic timeseries C3js chart

flow api 可以让你做你要求的事情，但有一个重大错误(请参阅我的答案)，因此调整提问者自己的答案可能是平滑水平过渡的最佳选择

PS。如果您还想停止 y 轴自动调整大小，则需要在图表声明中添加以下内容:

axis: {
        y: {
            max: 1 // translates to 100% on the y axis
        }
    }