javascript - Canvas 到图像显示为无图像(空白)

Question

我正在使用 dataurl 将 Canvas 转换为图像。我有以下代码，在控制台中没有输出错误。似乎有点工作，但是当我访问 dataurl 时，它显示一个空白图像。

window.onload = function() {
    var canvas = document.getElementById("myCanvas");
    var context = canvas.getContext("2d");
    var imageObj = new Image();

    imageObj.onload = function() {
        var myImage = context.drawImage(imageObj, 0, 0);        
        var myImg = canvas.toDataURL("image/png");
        document.getElementById("canvasimg").setAttribute("src", myImg);
    };
    imageObj.src = "http://img801.imageshack.us/img801/5641/3cc67ca1a74049ce99bc92b.png";
};

<canvas id="myCanvas" width="578" height="400"></canvas>
<img id="canvasimg" alt="" src="">

Answer 1

看看你在做什么。您在图像加载时绘制图像，但在绘制图像之前将其转换为数据 url!将 toDataURL 调用和 setAttribute 调用移至 onload 函数内。