Tomáš Čičman
Tomáš Čičman

Reputation: 281

How to force animation on chartjs?

I have charts grouped under tab (based on this) like this: charts When I reload the page or update values, animation works well. But I would like to start animation when I open tab with charts. Is it possible?

I tried to use chart.update() or chart.render() but nothing work.

Upvotes: 0

Views: 1385

Answers (2)

Alien
Alien

Reputation: 258

There is possible solution if you destroy charts and create a new one.

 Chart.helpers.each(Chart.instances, function(chart){
    let ctx = chart.chart.ctx;
    let config = chart.config;
    chart.destroy();
    new Chart(ctx, config);
})

It will get all chart instances so you can easy get config and ctx of charts. Just put this in function what you call when you click on tab.

Upvotes: 1

neophytte
neophytte

Reputation: 690

Define your chart with a 'this':

this.myChartInstance = new Chart(ctx, { ...

Then use a Javascript call in the:

<li><a data-toggle="tab" onclick="update" href="#menu1">Menu 1</a></li>

and call the script to re-animate ...

function update() {
    this.myChartInstance.update();
}

Upvotes: 0

Related Questions