Blogbooks, e-books and future proofing chemical diagrams.

Most of the chemical structure diagrams in this blog originate from Chemdraw, which seems to have been around since the dawn of personal computers! I have tended to use this program to produce JPG bitmaps for the blog, writing them out in 4x magnification, so that they can be scaled down for display whilst retaining some measure of higher resolution if needed for other purposes. These other purposes might be for e.g. the production of e-books (using Calibre), the interesting Blog(e)book format offered as a service by Feedfabrik, or display on mobile tablets where the touch-zoom metaphor to magnify works particularly well. But bitmap images are not really well future proofed for such new uses. Here I explore one solution to this issue.

I have previously mentioned scalable vector graphics (SVG) as an alternative, and fortunately the production of such has become routine.3 The diagram above2 is indeed SVG (and if you cannot see it, then try a modern SVG-capable browser1). It was produced thus:

  1. Drawn in Chemdraw
  2. Exported as Encapsulated postscript
  3. Imported into  Scribus, an Open Source desktop publishing program (where it can be annotated/edited if need be)
    • This program will also need Ghostscript installed to handle the EPS
  4. and exported from Scribus to SVG.
  5. Notice how the diagram above automatically scales to fill the width of the page. If you click on it, you get the diagram on its own. If you zoom the browser window, it should scale perfectly.
  6. I note that these SVG diagrams work well in e-books or blogbooks.
There seem to be many other (open) programs out there which support SVG, so the above combination is not necessary the only one, or indeed the best. There is one other aspect which might be mentioned. The old GIF or JPG bitmap formats do have good meta-data support, such as  EXIF, GPS or XMP. These invisible data have often been used to embed a molecular connection table into a GIF or JPG file, such that the original molecular data can be reconstituted from the image file. Unfortunately, there are no real standards for doing this, and so round-tripping the data is probably a closed process within a specific software environment. However, because SVG is an XML format, it can be readily made to carry such information in a fully inter-operable manner. For example, one could easily embed a CML description of the molecule into its own container (namespace) in the SVG file. For the purposes of rendering an on-screen image, this extra information is of course ignored.

1 I notice that Internet Explorer 9 (both 32- and 64-bit versions) will display (and save) the above diagram if you click on it, but it cannot (yet) be inlined into the post, although the documentation implies it should.
2 The version below is the conventional JPG form (click on it to see the original 4x version).

Diagram displayed using JPG.

3. Historical note. Peter Murray-Rust and I have been promoting SVG for use in chemistry for 11+ years now. For one ancient page, see here. The syntax has decayed somewhat, but some of the diagrams still work!

Author

Tags: , , , , , , , , , ,

Leave a Reply