Bootstrap carousel shows animation only in first slide

Question

My bootstrap carousel has 4 slides and all of them have animated charts but the animation is seen only in first slide. How do I ensure that the chart animations for the rest

Answer 1

You are creating the chart animation on window.onload.Copy the same to slid.bs.carousel event. Check the below snippet.

$(".carousel").on('slid.bs.carousel', function (evt) {
var myPie = new Chart(document.getElementById("canvas_Pie1c").getContext("2d")).Pie(mydata2, opt1c);
var myPie = new Chart(document.getElementById("canvas_Pie2c").getContext("2d")).Pie(mydata2, opt1c);
});