在c3.js中生成点对点动画 [英] generate point-to-point animation in c3.js

问题描述

添加新点(不重新启动图表中的所有点)时，如何生成动画.当添加新点时，更改有些突然.这个想法是在添加新点或新点时生成动画.

How can I generate an animation when a new point is added (without restarting all the points in the chart). when a new point is added, the change is somewhat abrupt. the idea is to generate an animation when you add new or new points.

例如: https://jsfiddle.net/ej0wLtv6/

这是我的代码:

https://jsfiddle.net/pL4mL2sr/

setTimeout(load, 1000);
function load(){
    chart.load({
       xs: {
          data1: 'data1_x'
       },
       columns: [
          data1_x,
          data1
        ]
   });
}

推荐答案

您想将持续时间应用于过渡:

通过将其添加到传递给c3的选项中，可以在点更新时获得平滑的感觉

By adding this onto your options that you pass to c3, it gives a smooth feel when points update

transition: {
  duration: 2000
}

签出更新的小提琴以获取有关数据的示例: https://jsfiddle.net/j1afur1j/

Checkout out the updated fiddle for an example with your data: https://jsfiddle.net/j1afur1j/

这篇关于在c3.js中生成点对点动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！