要将DIV内容发送到HTML5 Canvas,您可以使用以下步骤:
function getDivScreenshot(divId) {
let div = document.getElementById(divId);
let canvas = document.createElement('canvas');
canvas.width = div.clientWidth;
canvas.height = div.clientHeight;
let ctx = canvas.getContext('2d');
ctx.drawImage(div, 0, 0, canvas.width, canvas.height);
return canvas;
}
function canvasToImage(canvas) {
let img = new Image();
img.src = canvas.toDataURL('image/png');
return img;
}
function drawImageToCanvas(canvas, img) {
let ctx = canvas.getContext('2d');
ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
}
let divId = 'yourDivId';
let canvas = document.getElementById('yourCanvasId');
let divScreenshot = getDivScreenshot(divId);
let divImage = canvasToImage(divScreenshot);
drawImageToCanvas(canvas, divImage);
这样,您就可以将DIV内容发送到HTML5 Canvas了。请注意,这个方法可能在不同的浏览器中表现不同,因此您可能需要进行一些调整以确保兼容性。
领取专属 10元无门槛券
手把手带您无忧上云