HTML5 Canvas Base64 Ошибка

Question

Любая идея, почему этот код не работает? : \

Demo ->https://jsfiddle.net/vgmFN/89/

<script> 
     var imgObj1 = new Image(); 
     var img = new Image();var a1=0; 
     var can = document.getElementById('canvas1'); 
     var ctx = can.getContext('2d'); 
     imgObj1.onload = function() { 
     ctx.drawImage(imgObj1,1,1);a1 = 1; 
     } 
     imgObj1.src = 'favicon.ico'; 
     if (a1 == 1) { 
     console.log(can.toDataURL()) 
     img.src = can.toDataURL(); 
     document.body.appendChild(img); 
     a1=0; 
     } 
     </script> 

Answer 1

Вы дали imgObj1 время для загрузки с imgObj1.onload, но вы должны также дать img время загрузки путем добавления img.onload

https://jsfiddle.net/m1erickson/tf0y1pL9/

BTW, ошибки легче определить, если вы отформатируете свой код. ;-)

var can = document.getElementById('canvas1'); 
var ctx = can.getContext('2d'); 

// create and load the first image 
var imgObj1 = new Image(); 
imgObj1.onload = function() { 

    ctx.drawImage(imgObj1,1,1); 

    // create and load the canvas as an image 
    var img = new Image(); 
    img.onload=function(){ 
     document.body.appendChild(img); 
    } 
    img.src = can.toDataURL(); 

} 
imgObj1.src = '/favicon.ico';