如何在画布上绘制内嵌svg（在DOM中）？

对于嵌入式SVG，您需要：

• 将SVG字符串转换为

  Blob

• 获取Blob的URL
• 创建图像元素并将URL设置为

  src

• 加载（

  onload

  ）后，您可以将SVG绘制为画布上的图像
• 用于

  toDataURL()

  从画布获取PNG文件。

例如：

function drawInlineSVG(ctx, rawSVG, callback) {    var svg = new Blob([rawSVG], {type:"image/svg+xml;charset=utf-8"}),        domURL = self.URL || self.webkitURL || self,        url = domURL.createObjectURL(svg),        img = new Image;    img.onload = function () {        ctx.drawImage(this, 0, 0);  domURL.revokeObjectURL(url);        callback(this);    };    img.src = url;}// usage:drawInlineSVG(ctxt, svgText, function() {    console.log(canvas.toDataURL());  // -> PNG data-uri});

当然，此处的console.log仅作为示例。请在此处存储/传输字符串。（我也建议

onerror

另外，请记住使用

width

height