svg转换图片的base64
思路:
1svg部分序列化
2拼接svg+xml的base64s
3把svg+xml的base64s放入图片容器中
4把图片画进canvas中
5把canvas转换成base64
// ↓ 第一部分
const svg = document.getElementById('mySvg');
//返回序列化的xml字符串s
const s = new XMLSerializer().serializeToString(svg);
//获取svg的base64s
const src = `data:image/svg+xml;base64,${window.btoa(escape(encodeURIComponent(s)))}`;
// ↓ 创建图片容器并存放
const img = new Image();
// 创建图片容器承载过渡
img.src = src;
// 注意:需要在图片onload方法中执行
img.onload = () => {
// ↓ 第二部分
const canvas = document.createElement('canvas');
canvas.width = img.width; canvas.height = img.height;
const context = canvas.getContext('2d');
context.drawImage(img, 0, 0);
const ImgBase64 =canvas.toDataURL('image/png');
}