Open Source

Four ways to generate or process Inkscape vector graphics automatically

Marco Fioretti shows you how to use the open source program Inkscape to automatically generate or modify vector graphics.

Vector graphics are digital images that, unlike what happens with digital photographs, can be redrawn or rescaled at any size without any loss of quality. The reason why, to put it simply, is that such graphics don't contain low-level lists of colored points (pixels) but computer instructions on how to draw each of their geometric elements. The most popular Free Software editor for vector graphics is the cross-platform Inkscape.

I have already shown, here on TechRepublic, how to insert interactive vector charts in your Web pages. This time, I'll introduce some general methods to automate generation or modification of images of the same kind with Inkscape and a bit of scripting. If you need more details on specific points, just ask for them in the comments, and I'll devote another post to them.

Why would you want to learn something like this? Well, because the techniques described here may save a lot of time and boring, repetitive work for anyone who has to:

  • save many vector graphics in different formats and/or at different sizes and resolutions (e.g. one for Web publishing, one for printing business cards or brochures, and one for printing large posters)

  • create many, slightly different versions of the same base graphic, for personalized logos or banners

  • create sketches, containing all the objects of the final graphic, ready to be rearranged or completed manually without starting from scratch (this may be useful to teachers using vector graphics as parts of personalized homework)

Let's now see how all this can happen. Like many other good Free Software tools, Inkscape has a command line interface (CLI). That way to use Inkscape may seem unnatural, but can make it much more usable (by making you open the GUI only when it's really needed) even on very slow hardware. Some operations will work even on systems without any graphical desktop installed, that is, should you ever need it, on remote servers. In general, you can use the Inkscape CLI to convert graphics, modify them, or check their structure and properties. The complete list of options is available in the manual, or by typing inkscape --help at the command prompt.

#1 Print or export to other formats

Need to print or convert automatically many Inkscape graphics at some specified resolution? No problem! Some combination of the Inkscape --export options, properly embedded in a Bash script loop will do the job:

  1 for F in `find . -type f -name "*svg"`
   2  do
   3    BASE=`basename $F .svg`
   4    inkscape --export-area-drawing     \
   5      --export-png=$BASE.exported.png  \
   6      --export-width=60                \
   7      --export-height=60 $F 
   8  done

The Bash code above finds all the files with the .svg extension in the current directory (and all its subdirectories!). Line 3 puts its basename in the temporary variable $BASE. Lines 4 to 7 are one single Inkscape invocation, that creates a PNG copy of the specified size, called $BASE.exported.png, of the whole drawing contained in the original file. Should you need printing, instead, check out the -p option, which may be even piped to other programs.

# 2 Modify existing vector graphics with Inkscape verbs

Automatic export or format conversion of your drawings is good. Telling your computer to do the actual drawing, or at least many small, necessary but brainless edits is much better. In the Inkscape CLI, commands are associated to verbs. Pass to Inkscape the --verb-list switch to know which verbs it understands. Using verbs, creation of many variants of the same drawing is a snap, as shown in this popular example:

inkscape --select=path616 --verb ObjectFlipVertically --verb FileSave --verb FileClose violin_key_flipped.svg

This tells Inkscape (see Figure A) to flip vertically the violin key object inside the violin_key_flipped.svg file and then save it, with the same name.

Figure A

figure_a_inkscape_verbs.png

Of course, in order to tell Inkscape to modify something, you must know what its name is: if I had not told Inkscape to work on the object called path616, nothing would have happened. There are two ways to get this information. One is to open the initial vector graphic with Inkscape, right-click on the object that should be later modified from the CLI, and select "Properties". At the prompt or from shell scripts, instead, you should use the --query options of Inkscape. --query-all, for example, provides name, position, size and other information of all the objects that constitute a vector graphic:

[marco@polaris ~]$ inkscape --query-all violin_key.svg 
  svg101,1.6352039,1.7660537,85.876586,157.44916
  path616,5.1436469,22.91937,72.013421,116.11488
  path615,1.6352039,1.7660537,85.876586,157.44916
  ... (rest of outputs snipped for brevity)

#3 Generate slideshows from text

The cool, little known tool called InkSlide creates vector graphics slideshows, using a previously generated Inkscape template, from plain text input like this:

 Slide Title
  ++++++++++++++++++
  
  - first level bullet
    - second level bullet...

#4 Process SVG with shell scripts

Being just drawing instructions, vector graphic are mostly made of plain text:

 [marco@polaris scripting_inkscape]$ more violin_key_flipped.svg
  <?xml version="1.0" encoding="UTF-8" standalone="no"?>
  <!-- Created with Sodipodi ("http://www.sodipodi.com/") -->
  
  <svg
     xmlns:dc="http://purl.org/dc/elements/1.1/"
  etc etc...

Therefore, we can generalize what you just read in the previous paragraph. You can write your own scripts that, just like InkSlide, edit or combine text and/or files generated manually with Inkscape to produce other vector graphics. Of course, this method is more difficult than the others, but it also is much more flexible. Inkscape verbs, for example, cannot use parameters. Such a limitation doesn't exist if you process the graphics source code by yourself. Besides, this is something that you may even do manually, with any text editor, if you had to make little changes to a graphic in a hurry, when Inkscape isn't available. In practice, to learn how to do this from Inkscape, you should click on "Edit->XML Editor". In that window, you'll be able to see how actions performed in the graphic interface change the XML source. This will teach you how your script should work to reproduce the same edits.

I'll stop here for now, but if you want to know more, just ask. In the meantime, have a look at these tips for creating diagrams and at these to play with text inside vector graphics.

About

Marco Fioretti is a freelance writer and teacher whose work focuses on the impact of open digital technologies on education, ethics, civil rights, and environmental issues.

0 comments