SVG: Можно ли ссылаться на один и тот же элемент/группу/путь, а не копировать его несколько раз?

Я работаю над некоторой графикой для небольшой игры. Графика будет SVG и будет в основном основанной на плитке (подумайте Легенда о Zelda: Link to the Past для SNES). Я нарисовал небольшую плитку из травы и хотел бы скопировать этот NxM раз по всему полю. Выполнение этого в Inkscape или другом инструменте редактирования SVG для SVG приводит к тому, что файл размером более 3,5 Мбайт больше, чем 32-разрядная растровая карта того же размера.

Я хотел бы знать, можно ли определить какой-либо объект "травяной черепицы", и вместо того, чтобы копировать его на каждое место в моей области, просто ссылайтесь на него с соответствующими координатами. Я понимаю, что это все равно приведет к тому, что на сцену будет загружен одинаковый объем памяти, но это будет означать гораздо меньшие файлы для хранения на диске, и, надеюсь, это будет означать облегчение редактирования, поскольку в этом случае, если я хочу изменить, например, цвет моей травы, мне нужно изменить объект архетипа вместо того, чтобы внести изменения, а затем снова скопировать новую плиту по всему полю.

Я сделал около полудюжины различных поисков для различных ключевых слов, которые, как я думал, могут помочь, но ничего похожего не делает, что я ищу. Я думал использовать атрибут "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)" />

и т.д.. чтобы скопировать его несколько раз в новые места. Цените, если кто-нибудь может сообщить мне, если это возможно. На данный момент я не надежду, поэтому, если вы также знаете, что это невозможно, пожалуйста, дайте мне знать, чтобы я мог перестать тратить свое время.

Спасибо!

Ответ 1

Вы почти находитесь, элемент, который вы ищете для копирования/клонирования, <use>

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

Ответ 2

Вы упомянули о необходимости использовать инструменты GUI для этого, поэтому я хотел сообщить вам, что это возможно в Inkscape. Вам нужно использовать инструмент Clone, который находится на панели инструментов рядом с инструментом Duplicate, или вы можете нажать Ctrl-D. Когда вы его используете, клон будет помещен непосредственно поверх объекта, который он клонирует. Просто используйте инструмент перемещения, чтобы поместить его туда, где вы хотите.

Inkscape также имеет опцию "Оптимизированный SVG" в раскрывающемся списке "Тип файла" диалогового окна "Сохранить", что позволит вам уменьшить размер файла SVG, удалив постороннюю информацию, а также, возможно, уменьшая точность.