Chartist.js动画结束事件

Question

我想在图表准备好后显示一个区块。我没有在 docs 中找到 "end of animation" 事件。有没有办法在所有动画完成后执行一些代码？

Answer 1

我相信您可以使用 'created' 事件处理程序。

var chart = new Chartist.Line(...);
// attach an event handler to the "created" event of the chart:
chart.on("created", function () {
    // call some function
    triggerSomeEvent();
});

来源：

Answer 2

感谢 Mark 的帮助。我的解决方案：

var chart = new Chartist.Line(...);

var endOfAnimation;
var seq = 0;
var delays = 48;
var durations = 300;

chart.on("draw", function(data) {
    seq++;

    /* Animations */

    /* element.animate({ 
           opacity: {
           begin: seq * delays,
           dur: durations,
           from: 0,
           to: 1
       }); */
}

chart.on("created", function() {
    clearTimeout(endOfAnimation); // prevent function call duplication 

    endOfAnimation = setTimeout( function(){

        /* some code after all animations are finished */ 

    }, (seq + 1) * delays + durations);

    seq = 0;
    });

Chartist.js动画结束事件

Chartist.js animation end event

javascript

chartist.js