关于导出带有背景色的canvas

主要思路：

将要保存的canvas的图像通过toDataURL转换为base64位编码

let imageData = $("#canvas")[0].toDataURL("image/png");
let newImage = new Image();
newImage.src = imageData;

创建一个newCanvas用于转换，将newCanvas填充背景色颜色，将newImage通过drawImage()画在newCanvas上，最后在通过toDataURL就可以获得有背景色的canvas图像了。

newImage.onload = function (e) { 
//！！！注意：对newCanvas的操作一定要在newImage加载完成后进行！！！！
obj.fillStyle = BackgroundColor;
obj.fill();
obj.fillRect(0, 0, canvas.width, canvas.height);
obj.drawImage(e.currentTarget, 0, 0, width.value, height.value);
let getImage= $("#newCanvas")[0].toDataURL("image/png"); }

不使用getImageData和putImageData的原因：

putImageData 会把通过 fillRect() 填充好的颜色覆盖掉，与之相反 toDataUrl() 生成的图像是透明的不会将画好的背景色覆盖掉。