javascript - 在客户端将 Canvas 转为 PNG

Question

我有一个 Canvas ，我想将其转换并显示在标签中。我知道我们可以使用 toDataURL() 和 toBlob() 将 Canvas 转换为图像，但这两种方法都给我 base64 数据，这不是图像。

$("#upload_feedback_btn").on("click", function() {
let feedbackSrc = document.getElementById("capture").toDataURL('image/png', 1.0);
        $("#feedback_canvas_image").append("<img id='upload_canvas_img' src="+feedbackSrc+">");
    });

Answer 1

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

ctx.fillRect(50,50,50,50);

var img = new Image();
img.src = can.toDataURL();
document.body.appendChild(img);

http://jsfiddle.net/simonsarris/vgmFN/