using oninit/onrender to animate initlial data loading

542 views
Skip to first unread message

Guy Katz

unread,
Apr 13, 2015, 10:32:12 AM4/13/15
to c3...@googlegroups.com
Hi;
1. is there a way to create a bar chart with its data defined with values and just have them animate as if I have called the load method on the chart? (growing from 0 to the actual value instead of simply changing opacity
2. I could not find the answer to 1 so I went looking for using oninit / onrender to achieve this as follows:
var chart = c3.generate({
    data: {
        columns: [
                ['data3', 0]
        ],
        type: 'bar'
    },
     onrendered: function () { 
         this.load({
            columns: [
                ['data3', 130]
            ]
        });
    },
    bar: {
        width: {
            ratio: 0.5
        }
    }
});

I used 'this' but even though it had a load method in its proto its not doable (probably its not the finished chart). I took a look at the callback arguments property but there's nothing there. so I am looking for a way to load data from these callbacks into the chart in order to achieve animation
if I cut the onrendered code above and call load from the 'outside' everything works but it seems like a bad practice to me...
so I do not want to do this instead:
         chart .load({
            columns: [
                ['data3', 130]
            ]
        });

any suggestions?
any hack I can you? to retrieve the chart from the oninit/onrender?
thanks!

Anton Roolaart

unread,
Sep 28, 2015, 6:00:32 PM9/28/15
to c3js
I'm looking for the same answer, did you ever find a solution?
Thanks
Anton

Luis Carrizo

unread,
Mar 24, 2019, 7:30:08 PM3/24/19
to c3js
Me too, any solution?

Thanks,
Luis

rick...@googlemail.com

unread,
Apr 26, 2019, 10:39:51 AM4/26/19
to c3js
Will that be in the future? Would be very important.
Reply all
Reply to author
Forward
0 new messages