在内联html img标记中显示带有图像标记的SVG

Question

为了将SVG转换为PNG，我将svg innerHTML内容放在img标记中，如下所示：

<img src="data:image/svg+xml;UTF8,<svg> ....</svg>"> />

SVG图片显示不正确，特别是SVG标签内的图片如此（其他svg标签正确显示）：

<image xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="none" xlink:href="../../Content/Images/picture.png" height="38" width="38" y="17" x="17"/>

浏览器是否支持这种情况？

感谢您的帮助

Answer 1

出于隐私原因，如果在图像上下文中使用SVG文件，即通过html <img>标记或作为背景CSS图像，则必须在单个文件中完成。

这意味着SVG文件中的所有图像都必须编码为data URIs。