Javascript array always undefine

Question

I'm trying push some values to javascript array, but I always have array of undefined values.

    var picArray = [];
    var picTmp;
    for(var i =0; i < 4; i++)
    {
        html2canvas($("#graph-"+i), {
            onrendered: function(canvas) {
                picTmp = canvas.toDataURL();
            }
        });
        picArray.push(picTmp);
    }
    console.log(picArray);

All views are rendered. What's am I doing wrong ?

Answer 1

I think your plugin is working asynchronously , so fill the array after your onrendered callback like,

html2canvas($("#graph-"+i), {
   onrendered: function(canvas) {
       picTmp = canvas.toDataURL();
       picArray.push(picTmp); // add here after render callback
   }
});