SVG转Canvas并添加背景图片进行上传

SVG是什么

SVG是很早之前就出来的通过xml格式来定义并渲染矢量图片的一种方式，因为是类似Dom节点的格式，所以xml节点可以像Dom一样，可以通过js或者jQuery直接获取并修改。好处就是因为是矢量图，所以放大缩小不失真，一般地图开发中使用最多。

Canvas是什么

Canvas就是一张画布，只有width,height,id这3个属性，其他只能通过js来改变，通过调用js api来画图，这是H5发布后新增的。

SVG图片上传

一般svg绘制的图片直接上传不了，要转换到base64数据才能上传.
网上很多介绍canvg.js来进行svg转变成canvas，然后canvas通过toDataURL再转变成blob进行上传的，如果没有背景图片需求，这样是完全没问题的，但是如果canvas需求背景图片的话，因为toDataURL方法不认为canvas的css属性background-image是数据内容的一部分，所以toDataURL转换后的blob信息没有背景图片，不是黑的就是白的。

Canvas带背景图片上传

toDataURL信息想要带背景图片的话，一定要使用drawImage来进行绘画，所以canvas想要带背景图片的，可以使用drawImage来先绘制背景图片，然后在绘制其他图片内容。

SVG带背景图片上传

所以svg想要带背景图片上传的话，就可以利用drawImage重载方法支持image,canvas来通过2个canvas来实现, canv