SVG:我可以引用相同的元素/组/路径而不是多次复制它吗?

Ben*_*Ben 12 graphics svg

我正在为一款小游戏制作一些图形.图形将是SVG并且将主要基于图块(想想塞尔达传说:SNES的过去链接).我画了一个小草砖,想在整个场地上复制NxM次.在Inkscape或其他GUI SVG编辑工具中执行此操作会导致文件超过3.5MB,大于相同尺寸的32位位图.

我想知道是否可以定义某种"草瓦"对象,而不是将其复制到我的场中的每个点,只需用适当的坐标引用它.我意识到这仍然会导致场景在加载时占用相同数量的内存,但这意味着要在光盘上存储更小的文件,希望这意味着更容易编辑,因为在这种情况下,如果我想要更改,例如,我的草的颜色,我只需要更改我的原型对象而不是进行更改,然后在整个字段上重新复制新的图块.

我已经针对各种关键字做了大约6次不同的搜索,我认为这些搜索可能有所帮助,但似乎没有什么可以做我正在寻找的东西.我想使用'xlink:href'属性,因为我看到它在标签中用于首先定义调色板,然后在包含变换数据的单独标签中引用它.

我尝试过使用类似的东西:

<path id="grassyPatch" d="M 3.3310392e-7,608 31.993091,624 63.986183,608 31.993091,592 z" style="..." />

然后用以下内容复制它:

<path id="grass-copy1" xlink:href="#grassyPatch" transform="translate(32,-32)" /> <path id="grass-copy2" xlink:href="#grassyPatch" transform="translate(32,-64)" />

等,以便将它复制几次到新的位置.感谢是否有人可以告诉我这是否可行.到目前为止,我并没有抱着希望,所以如果你也知道这是不可能的,请让我知道,这样我就可以不再浪费时间了.

谢谢!

Rob*_*son 35

你几乎就在那里,你正在寻找复制/克隆的元素是 <use>

<use xlink:href="#grassyPatch" transform="translate(32,-32)" />