有这样一个svg - 这是一个简单的二维码。viewBox 可以是任意的,具体取决于文本的大小和 QRCorrectLevel 的值。
<svg version="1.2" baseProfile="tiny" viewBox="0 0 23 23" fill="#000000"><rect x="0" y="0" width="23" height="23" fill="#ffffff" style="fill: #ffffff !important"></rect><rect x="1" y="1" width="1" height="1"></rect><rect x="2" y="1" width="1" height="1"></rect><rect x="3" y="1" width="1" height="1"></rect><rect x="4" y="1" width="1" height="1"></rect><rect x="5" y="1" width="1" height="1"></rect><rect x="6" y="1" width="1" height="1"></rect><rect x="7" y="1" width="1" height="1"></rect><rect x="9" y="1" width="1" height="1"></rect><rect x="10" y="1" width="1" height="1"></rect><rect x="15" y="1" width="1" height="1"></rect><rect x="16" y="1" width="1" height="1"></rect><rect x="17" y="1" width="1" height="1"></rect><rect x="18" y="1" width="1" height="1"></rect><rect x="19" y="1" width="1" height="1"></rect><rect x="20" y="1" width="1" height="1"></rect><rect x="21" y="1" width="1" height="1"></rect><rect x="1" y="2" width="1" height="1"></rect><rect x="7" y="2" width="1" height="1"></rect><rect x="9" y="2" width="1" height="1"></rect><rect x="10" y="2" width="1" height="1"></rect><rect x="11" y="2" width="1" height="1"></rect><rect x="13" y="2" width="1" height="1"></rect><rect x="15" y="2" width="1" height="1"></rect><rect x="21" y="2" width="1" height="1"></rect><rect x="1" y="3" width="1" height="1"></rect><rect x="3" y="3" width="1" height="1"></rect><rect x="4" y="3" width="1" height="1"></rect><rect x="5" y="3" width="1" height="1"></rect><rect x="7" y="3" width="1" height="1"></rect><rect x="12" y="3" width="1" height="1"></rect><rect x="13" y="3" width="1" height="1"></rect><rect x="15" y="3" width="1" height="1"></rect><rect x="17" y="3" width="1" height="1"></rect><rect x="18" y="3" width="1" height="1"></rect><rect x="19" y="3" width="1" height="1"></rect><rect x="21" y="3" width="1" height="1"></rect><rect x="1" y="4" width="1" height="1"></rect><rect x="3" y="4" width="1" height="1"></rect><rect x="4" y="4" width="1" height="1"></rect><rect x="5" y="4" width="1" height="1"></rect><rect x="7" y="4" width="1" height="1"></rect><rect x="9" y="4" width="1" height="1"></rect><rect x="10" y="4" width="1" height="1"></rect><rect x="11" y="4" width="1" height="1"></rect><rect x="12" y="4" width="1" height="1"></rect><rect x="13" y="4" width="1" height="1"></rect><rect x="15" y="4" width="1" height="1"></rect><rect x="17" y="4" width="1" height="1"></rect><rect x="18" y="4" width="1" height="1"></rect><rect x="19" y="4" width="1" height="1"></rect><rect x="21" y="4" width="1" height="1"></rect><rect x="1" y="5" width="1" height="1"></rect><rect x="3" y="5" width="1" height="1"></rect><rect x="4" y="5" width="1" height="1"></rect><rect x="5" y="5" width="1" height="1"></rect><rect x="7" y="5" width="1" height="1"></rect><rect x="10" y="5" width="1" height="1"></rect><rect x="11" y="5" width="1" height="1"></rect><rect x="15" y="5" width="1" height="1"></rect><rect x="17" y="5" width="1" height="1"></rect><rect x="18" y="5" width="1" height="1"></rect><rect x="19" y="5" width="1" height="1"></rect><rect x="21" y="5" width="1" height="1"></rect><rect x="1" y="6" width="1" height="1"></rect><rect x="7" y="6" width="1" height="1"></rect><rect x="11" y="6" width="1" height="1"></rect><rect x="15" y="6" width="1" height="1"></rect><rect x="21" y="6" width="1" height="1"></rect><rect x="1" y="7" width="1" height="1"></rect><rect x="2" y="7" width="1" height="1"></rect><rect x="3" y="7" width="1" height="1"></rect><rect x="4" y="7" width="1" height="1"></rect><rect x="5" y="7" width="1" height="1"></rect><rect x="6" y="7" width="1" height="1"></rect><rect x="7" y="7" width="1" height="1"></rect><rect x="9" y="7" width="1" height="1"></rect><rect x="11" y="7" width="1" height="1"></rect><rect x="13" y="7" width="1" height="1"></rect><rect x="15" y="7" width="1" height="1"></rect><rect x="16" y="7" width="1" height="1"></rect><rect x="17" y="7" width="1" height="1"></rect><rect x="18" y="7" width="1" height="1"></rect><rect x="19" y="7" width="1" height="1"></rect><rect x="20" y="7" width="1" height="1"></rect><rect x="21" y="7" width="1" height="1"></rect><rect x="9" y="8" width="1" height="1"></rect><rect x="11" y="8" width="1" height="1"></rect><rect x="1" y="9" width="1" height="1"></rect><rect x="3" y="9" width="1" height="1"></rect><rect x="4" y="9" width="1" height="1"></rect><rect x="6" y="9" width="1" height="1"></rect><rect x="7" y="9" width="1" height="1"></rect><rect x="8" y="9" width="1" height="1"></rect><rect x="11" y="9" width="1" height="1"></rect><rect x="15" y="9" width="1" height="1"></rect><rect x="18" y="9" width="1" height="1"></rect><rect x="20" y="9" width="1" height="1"></rect><rect x="21" y="9" width="1" height="1"></rect><rect x="1" y="10" width="1" height="1"></rect><rect x="2" y="10" width="1" height="1"></rect><rect x="3" y="10" width="1" height="1"></rect><rect x="4" y="10" width="1" height="1"></rect><rect x="5" y="10" width="1" height="1"></rect><rect x="11" y="10" width="1" height="1"></rect><rect x="13" y="10" width="1" height="1"></rect><rect x="16" y="10" width="1" height="1"></rect><rect x="18" y="10" width="1" height="1"></rect><rect x="19" y="10" width="1" height="1"></rect><rect x="21" y="10" width="1" height="1"></rect><rect x="3" y="11" width="1" height="1"></rect><rect x="5" y="11" width="1" height="1"></rect><rect x="6" y="11" width="1" height="1"></rect><rect x="7" y="11" width="1" height="1"></rect><rect x="8" y="11" width="1" height="1"></rect><rect x="9" y="11" width="1" height="1"></rect><rect x="10" y="11" width="1" height="1"></rect><rect x="13" y="11" width="1" height="1"></rect><rect x="14" y="11" width="1" height="1"></rect><rect x="15" y="11" width="1" height="1"></rect><rect x="16" y="11" width="1" height="1"></rect><rect x="17" y="11" width="1" height="1"></rect><rect x="20" y="11" width="1" height="1"></rect><rect x="21" y="11" width="1" height="1"></rect><rect x="9" y="12" width="1" height="1"></rect><rect x="13" y="12" width="1" height="1"></rect><rect x="14" y="12" width="1" height="1"></rect><rect x="18" y="12" width="1" height="1"></rect><rect x="20" y="12" width="1" height="1"></rect><rect x="1" y="13" width="1" height="1"></rect><rect x="4" y="13" width="1" height="1"></rect><rect x="7" y="13" width="1" height="1"></rect><rect x="9" y="13" width="1" height="1"></rect><rect x="12" y="13" width="1" height="1"></rect><rect x="14" y="13" width="1" height="1"></rect><rect x="17" y="13" width="1" height="1"></rect><rect x="18" y="13" width="1" height="1"></rect><rect x="20" y="13" width="1" height="1"></rect><rect x="9" y="14" width="1" height="1"></rect><rect x="10" y="14" width="1" height="1"></rect><rect x="14" y="14" width="1" height="1"></rect><rect x="16" y="14" width="1" height="1"></rect><rect x="18" y="14" width="1" height="1"></rect><rect x="20" y="14" width="1" height="1"></rect><rect x="1" y="15" width="1" height="1"></rect><rect x="2" y="15" width="1" height="1"></rect><rect x="3" y="15" width="1" height="1"></rect><rect x="4" y="15" width="1" height="1"></rect><rect x="5" y="15" width="1" height="1"></rect><rect x="6" y="15" width="1" height="1"></rect><rect x="7" y="15" width="1" height="1"></rect><rect x="9" y="15" width="1" height="1"></rect><rect x="10" y="15" width="1" height="1"></rect><rect x="14" y="15" width="1" height="1"></rect><rect x="15" y="15" width="1" height="1"></rect><rect x="17" y="15" width="1" height="1"></rect><rect x="18" y="15" width="1" height="1"></rect><rect x="19" y="15" width="1" height="1"></rect><rect x="1" y="16" width="1" height="1"></rect><rect x="7" y="16" width="1" height="1"></rect><rect x="9" y="16" width="1" height="1"></rect><rect x="11" y="16" width="1" height="1"></rect><rect x="12" y="16" width="1" height="1"></rect><rect x="13" y="16" width="1" height="1"></rect><rect x="14" y="16" width="1" height="1"></rect><rect x="15" y="16" width="1" height="1"></rect><rect x="18" y="16" width="1" height="1"></rect><rect x="19" y="16" width="1" height="1"></rect><rect x="1" y="17" width="1" height="1"></rect><rect x="3" y="17" width="1" height="1"></rect><rect x="4" y="17" width="1" height="1"></rect><rect x="5" y="17" width="1" height="1"></rect><rect x="7" y="17" width="1" height="1"></rect><rect x="10" y="17" width="1" height="1"></rect><rect x="12" y="17" width="1" height="1"></rect><rect x="15" y="17" width="1" height="1"></rect><rect x="19" y="17" width="1" height="1"></rect><rect x="20" y="17" width="1" height="1"></rect><rect x="21" y="17" width="1" height="1"></rect><rect x="1" y="18" width="1" height="1"></rect><rect x="3" y="18" width="1" height="1"></rect><rect x="4" y="18" width="1" height="1"></rect><rect x="5" y="18" width="1" height="1"></rect><rect x="7" y="18" width="1" height="1"></rect><rect x="9" y="18" width="1" height="1"></rect><rect x="10" y="18" width="1" height="1"></rect><rect x="14" y="18" width="1" height="1"></rect><rect x="17" y="18" width="1" height="1"></rect><rect x="18" y="18" width="1" height="1"></rect><rect x="20" y="18" width="1" height="1"></rect><rect x="1" y="19" width="1" height="1"></rect><rect x="3" y="19" width="1" height="1"></rect><rect x="4" y="19" width="1" height="1"></rect><rect x="5" y="19" width="1" height="1"></rect><rect x="7" y="19" width="1" height="1"></rect><rect x="9" y="19" width="1" height="1"></rect><rect x="12" y="19" width="1" height="1"></rect><rect x="14" y="19" width="1" height="1"></rect><rect x="17" y="19" width="1" height="1"></rect><rect x="19" y="19" width="1" height="1"></rect><rect x="1" y="20" width="1" height="1"></rect><rect x="7" y="20" width="1" height="1"></rect><rect x="10" y="20" width="1" height="1"></rect><rect x="11" y="20" width="1" height="1"></rect><rect x="12" y="20" width="1" height="1"></rect><rect x="13" y="20" width="1" height="1"></rect><rect x="15" y="20" width="1" height="1"></rect><rect x="17" y="20" width="1" height="1"></rect><rect x="18" y="20" width="1" height="1"></rect><rect x="21" y="20" width="1" height="1"></rect><rect x="1" y="21" width="1" height="1"></rect><rect x="2" y="21" width="1" height="1"></rect><rect x="3" y="21" width="1" height="1"></rect><rect x="4" y="21" width="1" height="1"></rect><rect x="5" y="21" width="1" height="1"></rect><rect x="6" y="21" width="1" height="1"></rect><rect x="7" y="21" width="1" height="1"></rect><rect x="9" y="21" width="1" height="1"></rect><rect x="10" y="21" width="1" height="1"></rect><rect x="11" y="21" width="1" height="1"></rect><rect x="12" y="21" width="1" height="1"></rect><rect x="13" y="21" width="1" height="1"></rect><rect x="16" y="21" width="1" height="1"></rect></svg>
还有另一个带有viewBox="0 0 500 500"的“ svg ”元素。据我所知,您只能使用“图像”将svg插入另一个svg ,但这不是最方便的选择,您必须先将图像记录在服务器上,目标是动态地将二维码插入另一个svg具有不同 viewBox 值的元素。
如果你尝试将第一个svg(用g替换svg)插入第二个,那么坐标自然会有问题。
也许还有其他一些方法可以将一个 svg 嵌入到另一个中,或者轻松地重新计算新 viewBox 的坐标?
您可以安全地将 svg 插入 svg https://developer.mozilla.org/ru/docs/Web/SVG/Element/svg
svg 元素是一个定义新坐标系和视口的容器。它用作 SVG 文档的最外层元素,但也可用于在 SVG 或 HTML 文档中嵌入 SVG 片段。