How to have smooth (horizontal) transition on a c3js dynamic chart
<p>I started playing with c3js hoping to get a good looking dynamic chart. While testing it I noticed that the transition between each <code>load</code> functions seems to happen without any sort of transition. I also tried to use the <code>flow</code> function but got to the same result. I couldn't find anything on this topic only but basically is there a way to change this behavior and have a smooth transition when a new data point comes in?</p>

<p>You can see my example here: </p>

<pre><code>        transition: {
            duration: 0
        },
</code></pre>

<p><a href="https://jsfiddle.net/g4cq6pg0/1/" rel="nofollow">https://jsfiddle.net/g4cq6pg0/1/</a></p>

<p>When I actually enable transition it works well (horizontally), until I start removing some data to add new metrics, then things go south. Instead of just transitioning horizontally it also transition vertically which makes things very hard to look at (350 is the default value):</p>

<pre><code>        transition: {
            duration: 350
        },
</code></pre>

<p><a href="https://jsfiddle.net/g4cq6pg0/2/" rel="nofollow">https://jsfiddle.net/g4cq6pg0/2/</a></p>

<p>How can I force a smooth horizontal transition only?? Here is an examples (using D3 only) of what I mean:</p>

<p><a href="http://bl.ocks.org/simenbrekken/6634070" rel="nofollow">http://bl.ocks.org/simenbrekken/6634070</a></p>