canvas 保存图片

要将canvas保存为图片，你可以使用HTML5的Canvas API中的toDataURL方法。这个方法可以将canvas绘制的内容转化为base64编码的图片格式。然后你可以使用该编码来生成一个图片文件或者直接将其保存。下面是一个示例代码：

// 获取canvas元素
var canvas = document.getElementById('MyCanvas');
var context = canvas.getContext('2d');

// 绘制canvas内容
context.fillStyle = 'red';
context.fillRect(0, 0, canvas.width, canvas.height);

// 保存canvas为图片
var dataURL = canvas.toDataURL('image/png');

// 创建一个链接元素并设置下载属性
var link = document.createElement('a');
link.href = dataURL;
link.download = 'canvas_image.png';

// 触发点击事件来下载图片
link.click();

在这个示例中，我们首先获取到canvas元素和一个2D绘图上下文。然后我们使用fillRect方法在canvas上绘制一个红色的矩形。接下来，我们使用toDataURL方法将canvas的内容转化为base64编码的图片格式，并将其赋值给dataURL变量。最后，我们创建一个链接元素，将dataURL设置为链接的href属性，并将文件名设置为下载属性。通过触发链接元素的点击事件，你就可以下载保存该canvas为图片了。