It is currently 16 Apr 2024, 09:58
   
Text Size

Experimenting with single-file SVG symbols

Discuss Card Scans and Other Artwork Here

Moderator: CCGHQ Admins

Experimenting with single-file SVG symbols

Postby JohnnyTH » 22 Jun 2016, 12:38

Greetings,

I opened a new thread cause I didn't want to hijack the Vector Set symbols thread, which is currently used for new expansion sets.

What I want to discuss here is the possibility to create an archive of all the expansion set symbols in SVG but I would like to have the SVG xml code hand-tuned and optimized, stripping out all irrelevant stuff, and reusing code as much as possible to avoid duplicate code.

The most obvious thing to factorize are:
  • Paths for each symbol, which should not appear multiple times for C, U, R, M versions
  • Gradient data across multiple symbols, when possible

As a first step I would be fine to factorize only the path data, i.e. having one file for each expansion set. I did a first experiment with EMA by pushing everything in the <defs> block and dividing the file between common data and specific data (i.e. stuff that might be eventually shared across different symbols and stuff that specific to this symbol).

You can open the file in Chrome and access the various rarities this way:
file:///C:/path/to/file/EMA_with_layers2.svg#mythic
You can replace "mythic" with "common", "uncommon" and "rare", let me know if it works for you.

Current drawbacks:
1) The file is no longer editable in Inkscape, due to the hand modifications to the XML data
2) Compatibility issues? Modern browsers should support "#layer" anchors on SVG images (it requires internal CSS rendering), but making a script which renders the PNG files from the SVG should be trivial
Attachments
EMA_with_layers2.zip
sample multi layer svg file
(1007 Bytes) Downloaded 362 times
JohnnyTH
 
Posts: 40
Joined: 23 Mar 2015, 13:03
Has thanked: 12 times
Been thanked: 22 times

Re: Experimenting with single-file SVG symbols

Postby Goblin Hero » 23 Jun 2016, 07:23

JohnnyTH wrote:I would like to have the SVG xml code hand-tuned and optimized, stripping out all irrelevant stuff, and reusing code as much as possible to avoid duplicate code.
What is the purpose of such like optimization?
When you´re a goblin, you don´t have to step forward to be a hero -- everyone else just has to step back.
User avatar
Goblin Hero
Site Admin
Site Admin
 
Posts: 1992
Joined: 23 Oct 2005, 09:37
Location: Russia
Has thanked: 218 times
Been thanked: 351 times

Re: Experimenting with single-file SVG symbols

Postby kudit » 23 Jun 2016, 19:29

JohnnyTH wrote:Greetings,

Current drawbacks:
1) The file is no longer editable in Inkscape, due to the hand modifications to the XML data
2) Compatibility issues? Modern browsers should support "#layer" anchors on SVG images (it requires internal CSS rendering), but making a script which renders the PNG files from the SVG should be trivial
Is it just me or is the rare version the same as the uncommon version?

By the way, the #anchors work in Safari as well.
Please give feedback on our card database at http://www.deckmaster.info
Send comments via PM here or info@deckmaster.info
User avatar
kudit
 
Posts: 178
Joined: 17 Apr 2014, 16:55
Has thanked: 151 times
Been thanked: 17 times


Return to Pictures

Who is online

Users browsing this forum: No registered users and 34 guests


Who is online

In total there are 34 users online :: 0 registered, 0 hidden and 34 guests (based on users active over the past 10 minutes)
Most users ever online was 4143 on 23 Jan 2024, 08:21

Users browsing this forum: No registered users and 34 guests

Login Form