LaTeX in Scalable Vector Graphics

For the uninitiated:

LaTeX has been around for quite a while, and is widely known in the scientific and academic community as being the best in desktop publishing and typesetting.  The principle is that the writer should be able to easily focus on the content/topic rather than being distracted by the way the resulting document appears.  Logical structure in articles, chapters, and sections are created by the author with visual presentation happening only after the content is complete.  LaTeX also makes it rather easy to create complicated mathematical formulae in a document otherwise not possible (or very difficult) with word processors — mainly the difference between word processing software and typesetting software, or What You See Is What You Get (WYSIWYG) versus What You See Is What You Mean (WYSIWYM).

Scalable Vector Graphics is a specification for creating 2-dimensional graphics from XML text files.  The resulting graphic images can be either static or dynamic, animated, or even interactive.  SVG is a relative newcomer in the field of graphic image formats, so it is not as widespread as say GIF or JPG.  SVG is also still in the early stages on the web, though there is some support in existing web browsers.  However, to compare SVG (vector images) to GIF or JPG (bitmap images) is tantamount to comparing apples to oranges.  Bitmapped images rely on dots, using positions and color for the dots.  Vector-based images rely on predefined shapes.  This means that vector-based images appear much sharper at very low resolutions where bitmap images begin to appear blocky and coarse.

The cool part:

Recently, a professor I work with came to me with a very specific need.  He wanted a particular piece of software that has been written as a plugin for Inkscape, an SVG editor, that allows LaTeX code to be input into an object and rendered inside an SVG image.  Not only that, but once the LaTeX object is embedded into the image, you can re-edit the rendered LaTeX object by changing the LaTeX code.

Why is this cool?  Simple.  Before, if you wanted to create a mathematical formula or complicated diagram for use in an image say on a webpage, you either had to use LaTex to create your formula inside a document, then convert the document to an image, then edit the image to be used for presentation (i.e., on a webpage), or you had to manually draw the formula by hand and save that as an image. This was a tedious and often error-prone process, with the only payoff in the end being a static image of a formula.

Hand-drawn equation

Hand-drawn equation

LaTeX rendered equation

LaTeX rendered equation

Now, you can create mathematical formulae inside SVG images with simple LaTeX code inside an SVG editor.  The plugin for Inkscape is called Textext, and will allow you to re-edit the rendered LaTeX formula after it has been rendered inside the SVG image.


About this entry