Imperial College London

Henry Rzepa

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](http://calibre-ebook.com/){target="_blank"}), the interesting
Blog(e)book format offered as a service by
[Feedfabrik](http://www.feedfabrik.com/){target="_blank"}, 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.

[![](http://www.ch.imperial.ac.uk/rzepa/blog/wp-content/uploads/2011/10/taxol-page001.svg "taxol"){.aligncenter
.size-full .wp-image-5314
decoding="async"}](http://www.ch.imperial.ac.uk/rzepa/blog/wp-content/uploads/2011/10/taxol-page001.svg)

I have [previously
mentioned](http://www.ch.imperial.ac.uk/rzepa/blog/?p=5218){target="_blank"} scalable
vector graphics (SVG) as an alternative, and fortunately the production
of such has become routine.^3^ The diagram above^2^ is indeed SVG (and
if you cannot see it, then try a modern SVG-capable browser^1^). It was
produced thus:

1.  Drawn in Chemdraw
2.  Exported as Encapsulated postscript
3.  Imported into
    [ Scribus](http://www.scribus.net/canvas/Scribus){target="_blank"},
    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.

<div>

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](http://en.wikipedia.org/wiki/Exchangeable_image_file_format){target="_blank"},
[GPS](http://en.wikipedia.org/wiki/GPS){target="_blank"} or
[XMP](http://en.wikipedia.org/wiki/Extensible_Metadata_Platform){target="_blank"}.
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.

</div>

------------------------------------------------------------------------

^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](http://msdn.microsoft.com/en-us/ie/hh410107.aspx){target="_blank"}
implies it should.  
^2^ The version below is the conventional JPG form (click on it to see
the original 4x version).

::: {#attachment_5334 .wp-caption .aligncenter style="width: 424px"}
[![](http://www.ch.imperial.ac.uk/rzepa/blog/wp-content/uploads/2011/10/taxol.jpg "taxol"){.size-full
.wp-image-5334 loading="lazy" decoding="async"
aria-describedby="caption-attachment-5334" width="414"
height="154"}](http://www.ch.imperial.ac.uk/rzepa/blog/wp-content/uploads/2011/10/taxol.jpg)

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](http://www.ch.ic.ac.uk/svg/){target="_blank"}. The syntax has
decayed somewhat, but some of the diagrams still work!

::: {.wp_orcid_field}
[https://orcid.org/0000-0002-8635-8390](https://orcid.org/0000-0002-8635-8390){target="_blank"
rel="author"}
:::


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.

Messaggi di Rogue Scholar

Blogbooks, e-books and future proofing chemical diagrams.