StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POSVG: Can I reference the same element/group/path instead of copying it multiple times?
text
Body
copied!<p>I'm working on some graphics for a small game. The graphics will be SVG and will be mostly tile-based (think Legend of Zelda: Link to the Past for SNES). I've drawn a small grass tile and would like to copy this NxM times over a whole field. Doing this in Inkscape or another GUI SVG-editing tool results in a file that's over 3.5MB, larger than a 32-bit bitmap of the same dimensions.</p> <p>I'd like to know if it's possible to define a "grass tile" object of some kind, and instead of copying it to each spot in my field, simply reference it with the appropriate coordinates. I realize that this will still result in the scene taking up the same amount of memory when loaded, but it will mean much smaller files for storage on disc, and hopefully it will mean easier editing since in this case, if I want to change, for example, the color of my grass, I only have to change my archetype object rather than make the change and then re-copy the new tile over the whole field.</p> <p>I have done about half a dozen different searches for various keywords that I thought might help, but nothing seems to do what I'm looking for. I thought to use the 'xlink:href' attribute, as I see this is used in the tags to define the color palette first, and then reference it later on in a separate tag containing the transform data.</p> <p>I tried using something like:</p> <p><code><path id="grassyPatch" d="M 3.3310392e-7,608 31.993091,624 63.986183,608 31.993091,592 z" style="..." /></code></p> <p>And then to copy it with something like:</p> <p><code><path id="grass-copy1" xlink:href="#grassyPatch" transform="translate(32,-32)" /></code> <code><path id="grass-copy2" xlink:href="#grassyPatch" transform="translate(32,-64)" /></code></p> <p>etc. in order to copy it several times to new locations. Appreciate if anyone could let me know if this is possible. I'm not holding out hope so far, so if you also know it to be <i>impossible</i>, please let me know as well so I can stop wasting my time.</p> <p>Thanks!</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload