barbara Posted August 22, 2017 Share Posted August 22, 2017 Hi, I'm making platform games with phaser, and to do so i prepare my levels in inkscape, i give a label to each image so when i end it i finally get an .svg document with an x and a y for each labeled element. Then i replace and delete all the useless text with my code editor till i get it in a .json format so i can pass it to my game as a new level. Is a repetitive and boring work, i hate it. So now i'm thinking in write a little "program" or script to do it. What i really don't know is how to pass through a text that it isn't an html or a php. i would prefer to code it with js as is the language i know most, but i'm open to suggestions. I think it shouldn't be so difficult as is only gather some text and creating a new document, but i don't know where to start. Thanks! Quote Link to comment Share on other sites More sharing options...
mattstyles Posted August 23, 2017 Share Posted August 23, 2017 You can use JS just fine, it won't be as quick as some other languages you could use but given that svg files are small and you're not doing much to it it will (almost certainly) be more than fast enough for your needs. Either pipe an svg file into your node process, or using `fs.readFile` or `fs.createReadStream` to grab the svg file you want to convert, then start parsing it. Work out what the rules are for your conversion. Svg is DOM, so I'm not sure how you're proposing to convert that to json, but, as you're doing it manually you're just following some conversion rules. You might get away with simple regex and replace for your rules, this is the simplest conceptually but can be quite error prone and its not very powerful if your rules get a bit more complex. The 2nd method is to convert the svg into an Abstract Syntax Tree (AST) and then use that to make a conversion before piecing it back together when you're done and have created your json representation (and which point use fs.createWriteStream or fs.writeFile or pipe it out of your process). Doing stuff with an AST can be a little trickier and it sounds like it's probably overkill for what you need but its an interesting topic and its widely used as JS firmly has a build process nowadays, check out how Babel, Traceur, JSX conversion etc etc work, they all use ASTs to implement more complex transformational logic. barbara 1 Quote Link to comment Share on other sites More sharing options...
b10b Posted August 23, 2017 Share Posted August 23, 2017 Try the Cheerio lib within your node app - I've used it extensively for server-side SVG manipulation and found it to be a reliable and stable library. https://cheerio.js.org/ barbara 1 Quote Link to comment Share on other sites More sharing options...
dimumurray Posted September 5, 2017 Share Posted September 5, 2017 You can automate your tasks by creating an Inkscape extension. You'll need to know Python. Here's a link to some documentation to get you started:https://inkscape.org/en/develop/extensions/ barbara 1 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.