js canvas 给 canvas 截图

在JavaScript中，如果你想要获取Canvas的内容作为图片，可以使用`toDataURL()`方法。这个方法会返回一个包含图像数据的URI，通常是Base64编码的。你可以直接把这个数据插入到新的img元素中显示，或者将其复制到剪贴板，甚至下载。

下面是一个基本的例子，展示如何获取Canvas截图并创建一个新的`<img>`元素来显示它：

// 获取Canvas元素
var myCanvas = document.getElementById('myCanvas');

// 使用toDataURL()获取截图数据
var screenshotData = myCanvas.toDataURL();

// 创建新的img元素插入到DOM
var imgElement = document.createElement('img');
imgElement.src = screenshotData;

// 将新img元素添加到文档中
document.body.appendChild(imgElement);

// 或者直接设置为剪贴板内容
if (window.ClipboardJS) {
    ClipboardJS.writeText(screenshotData);
}

// 如果需要保存为图片，可以这样：
function downloadCanvasImage(filename) {
    var a = document.createElement('a');
    a.href = screenshotData;
    a.download = filename;
    a.click();
}

downloadCanvasImage('screenshot.png');