{"action":"created","issue":{"url":"https://api.github.com/repos/jbosboom/svg-tiler/issues/1","labels_url":"https://api.github.com/repos/jbosboom/svg-tiler/issues/1/labels{/name}","comments_url":"https://api.github.com/repos/jbosboom/svg-tiler/issues/1/comments","events_url":"https://api.github.com/repos/jbosboom/svg-tiler/issues/1/events","html_url":"https://github.com/jbosboom/svg-tiler/issues/1","id":105902184,"number":1,"title":"Support defining symbols as styles over other symbols","user":{"login":"jbosboom","id":7757340,"avatar_url":"https://avatars.githubusercontent.com/u/7757340?v=3","gravatar_id":"","url":"https://api.github.com/users/jbosboom","html_url":"https://github.com/jbosboom","followers_url":"https://api.github.com/users/jbosboom/followers","following_url":"https://api.github.com/users/jbosboom/following{/other_user}","gists_url":"https://api.github.com/users/jbosboom/gists{/gist_id}","starred_url":"https://api.github.com/users/jbosboom/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jbosboom/subscriptions","organizations_url":"https://api.github.com/users/jbosboom/orgs","repos_url":"https://api.github.com/users/jbosboom/repos","events_url":"https://api.github.com/users/jbosboom/events{/privacy}","received_events_url":"https://api.github.com/users/jbosboom/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":2,"created_at":"2015-09-10T21:32:59Z","updated_at":"2015-09-11T01:56:44Z","closed_at":null,"body":"Suppose we want to tile a chess position.  The black and white pieces probably have the same shape, but differ in their color.  Currently we'd have a mapping file like\r\n\r\n    K @white-king.svg\r\n    k @black-king.svg\r\n    Q @white-queen.svg\r\n    q @black-queen.svg\r\n\r\nwhere the SVG files have the same paths with different stroke and fill colors.  This duplication makes changing the shapes or colors unnecessarily difficult.\r\n\r\nSVG supports CSS-like styles, and we should use them.  I see two particular ways forward:\r\n\r\n- Use CSS classes in the tile SVG files and specify a stylesheet on the command line, which will be embedded as a `<style>` element in the output SVG; the mapping file syntax will be extended to apply specified CSS classes to the `<use>` element referencing the symbol (e.g., `K @white-king.svg; fill:white; stroke:black;`).\r\n- Extend the mapping file syntax to long names, then define other symbols as `<g>` elements with style attributes enclosing references to the previously-defined symbols (e.g., `K <g fill=\"white\" stroke=\"black\"><use id=\"knight-template\" /></g>`).  This still requires care when authoring the tile SVGs, as any styles specified in the symbol cannot be overridden at the `<use>` site.  (There is syntax for referencing external files from `<use>` but I think the semantics are that of nested `<svg>` rather than `<symbol>` elements.)"},"comment":{"url":"https://api.github.com/repos/jbosboom/svg-tiler/issues/comments/139428658","html_url":"https://github.com/jbosboom/svg-tiler/issues/1#issuecomment-139428658","issue_url":"https://api.github.com/repos/jbosboom/svg-tiler/issues/1","id":139428658,"user":{"login":"jbosboom","id":7757340,"avatar_url":"https://avatars.githubusercontent.com/u/7757340?v=3","gravatar_id":"","url":"https://api.github.com/users/jbosboom","html_url":"https://github.com/jbosboom","followers_url":"https://api.github.com/users/jbosboom/followers","following_url":"https://api.github.com/users/jbosboom/following{/other_user}","gists_url":"https://api.github.com/users/jbosboom/gists{/gist_id}","starred_url":"https://api.github.com/users/jbosboom/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jbosboom/subscriptions","organizations_url":"https://api.github.com/users/jbosboom/orgs","repos_url":"https://api.github.com/users/jbosboom/repos","events_url":"https://api.github.com/users/jbosboom/events{/privacy}","received_events_url":"https://api.github.com/users/jbosboom/received_events","type":"User","site_admin":false},"created_at":"2015-09-11T01:56:44Z","updated_at":"2015-09-11T01:56:44Z","body":"According to the [Inkscape manual](http://tavmjong.free.fr/INKSCAPE/MANUAL/html/Web-Style.html), you can only add `class` attributes and embedded stylesheets with Inkscape's XML editor.  The FAQ mentions it [may reformat embedded stylesheets](https://inkscape.org/en/learn/faq/#I_have_manually_coded_SVG_files._Will_everything_be_messed_up,_if_I_load_and_save_it_with_Inkscape?), which at least means Inkscape has thought about preserving them.\r\n\r\nThe tiler can easily remove embedded stylesheets if we're willing to always lose them.  I don't know what happens if we leave them in with conflicting definitions from outside, but I'm guessing the inner definition will win, which would be the opposite of what we want."}}