[Chartjs]-Re-render (or animate) chart.js chart on transition within deck.js

by

1👍

✅

I got this to work by moving the code that defines the chart to be within the becameCurrent event function:

 $(function() {
    $.deck('.slide', {countNested: false});
    $.deck('showGoTo');
    $("#pie").bind('deck.becameCurrent', function(ev, direction) {
        const ctx1 = $("#NestedChart").get(0).getContext("2d");
        const myChart1 = new Chart(ctx1, {.....

This then re-renders the chart on each transition. An if loop allows it to only animate on a forward transition.
Putting the myChart1 variable declaration anywhere else initialises the chart the first time, but myChart1.render() or myChart1.reset().update() within the becameCurrent() function still don’t seem to do anything.

Leave a comment