是否可以将一个inkscape SVG 文档嵌入或链接到另一个文档中？

Question

我想要一个小的 SVG 文件（用 Inkscape 创建），并将它嵌入或链接到另一个（更大的）文件中。当浏览器显示时，我希望看到较小的显示在较大的占位符中。

是否可以？

Answer 1

宁愿<use>以<image>作为后来是在一个固定的分辨率渲染并不会扩展定期矢量对象在当前文档中做。http://www.w3.org/TR/SVG11/struct.html#ImageElement

但是该元素<use>不能引用整个 SVG 文件，它的xlink:href属性是对 SVG 文档中的元素/片段的引用（http://www.w3.org/TR/SVG11/struct.html#UseElement）。'use' 元素可以引用任何本地或非本地资源。

例子：

MyLibrary.svg:
<svg (...)>
        <rect x="0" y="0" width="200" inkscape:label="upper-left-blue"
              style="fill:#729fcf;fill-opacity:1;fill-rule:nonzero;stroke:none"
              id="upper-left-blue" height="200"/>

UseParts.svg:
        <use x="0" y="0" width="400" xmlns:xlink="http://www.w3.org/1999/xlink"
             xlink:href="MyLibrary.svg#upper-left-blue" xlink:type="simple"
             xlink:actuate="onLoad" height="400" id="use8793" xlink:show="embed"/>

对于不同的 SVG 编辑器/查看器，该功能的支持可能会有所不同，据我所知，它应该（至少）在 Inkscape、Firefox 和 Batik 中工作。

Answer 2

使用该image元素并引用您的 SVG 文件。为了好玩，请将以下内容另存为recursion.svg：

<svg width="100%" height="100%" viewBox="-100 -100 200 200" version="1.1"
     xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink">
  <circle cx="-50" cy="-50" r="30" style="fill:red" />
  <image x="10" y="20" width="80" height="80" xlink:href="recursion.svg" />
</svg>

来源：https ://stackoverflow.com/questions/5451135/embed-svg-in-svg/5451238#5451238