Question

我用我的画布做了这个图像因为我必须修改它并合并两个图像。但是我不想在我的html页面上显示它，而是在我的javascript中使用保存的第二个画布的URL。

我该怎么做？

var ctx = document.getElementById('canvas').getContext("2d");
var ctx2 = document.getElementById('canvas2').getContext("2d");
var img = new Image();
img.src = "https://scontent-mad1-1.xx.fbcdn.net/v/t1.0-9/10400072_76198580294_2746326_n.jpg?oh=b8cc93c35d6badfffb65ab5c9cbfce28&oe=5941AAB6";
var img2 = new Image();
img2.src = "https://icc-static-files.s3.amazonaws.com/ICC/photo/2017/01/31/f3a228a9-30ca-453e-99c5-ee6150c714a5/Facebook_Logo.png";
img.addEventListener('load', function(e) {
    ctx.arc(150, 150, 150, 0, Math.PI * 2, true);
    ctx.save();
    ctx.clip();
    ctx.drawImage(this, 0, 0, 300, 300);
    ctx.restore();
    ctx2.drawImage(ctx.canvas, 35, 60, 230, 230);
    ctx2.drawImage(img2, 200, 60, 75, 75);
}, true);

var dataURL = canvas2.toDataURL();

Answer 1

var dataURL = canvas2.toDataURL("image/png").replace("image/png", "image/octet-stream");

window.location.href=dataURL; //it save local

画布 - 将画布保存为png，不显示画布

1 个答案: