chartist js点动画

时间:2017-08-24 08:02:17

标签: html charts chartist.js

我用chartist.js做了一个图表,我用圆圈替换了这些点,所以我可以添加像here这样的轮廓。现在我想要点动画,但它不起作用。

以下是代码:

seq = 0, delays = 80, duration = 600;
chart.on('draw', function(data) {
      if(data.type === 'line' || data.type === 'area') {
        data.element.animate({
          d: {
            begin: 600,
            dur: 700,
            from: data.path.clone().scale(1, 0).translate(0, data.chartRect.height()).stringify(),
            to: data.path.clone().stringify(),
            easing: Chartist.Svg.Easing.easeOutQuint
          }
        });
      } else if(data.type === 'circle') {
            seq++;
            data.element.animate({
              opacity: {
                begin: seq * delays,
                dur: durations,
                from: 0,
                to: 1,
                easing: 'ease'
              }
            });
        }
    });

    seq = 0;

有什么想法吗?谢谢

0 个答案:

没有答案