ASCII Line Art with Orgmode and SvgBob

What Why Installation Emacs Example Finally

As long as typewriters or keyboards exist, people arrange characters to approximate graphics. This is referred to as ASCII art, although you could use other than ASCII characters. ASCII art also refers to the approximation of raster images by means of character arrays. This article, however, is about line art graphics as shown above.

I don't care, if someone really needs this, but I must write it down for myself, to memorize how to set this up, just in case.

I like the idea of having markup and simple graphics in one file. And, drawing ASCII art feels so nicely retro.

Many use Ditaa for ASCII art flow charts within Emacs. Also Graphviz seems to be popular, although Graphviz has nothing to do with ASCII art, but with visualising graphs (in the sense of graph theory) based on an abstract description.

For ASCII line art, I like the awesome tool SvgBob. Just check out the example page or the specification!

SvgBob is written in Rust, therefore install its package manager Cargo.

sudo apt install cargo

Then, install SvgBob. Do not use snap, because snap will prevent SvgBob from having access to /tmp, that is where Emacs Babel will temporarily store your ASCII line art snippets.

cargo install svgbob_cli

Luckily, there is the ready to use Lisp library file ob-svgbob out there on Github. Save it somewhere and add (add-to-list 'load-path "~/somewhere") to your .emacs file in your home directory.

I additionally created a symbolic link in my ~/bin directory to help Babel finding SvgBob.

~/bin/svgbob -> ~/.cargo/bin/svgbob_cli

There may be better ways, like adapting ob-svgbob or adding the path to PATH.

In Emacs, type M-x load-library RET ob-svgbob.

Add some ASCII art to your orgmode file, for example:

#+BEGIN_SRC svgbob :file ./img/wheatstone.svg :exports results
.----------------------------------------------------------------------------+
|                                                                            |\
|           +-----------o-------+                                            '-+
|           |           |       |                                              |
|           |          .+.     .+.                                             |
|           |        R2| |     | |R4                                           |
|           |          | |     | |                                             |
|           |          '+'     '+'                                             |
|        ---+--- +      |  .-.  |                R2                            |
|                       o-( U )-o          Rm = ---- · Rv   if U = 0           |
|         --+--  "-"    |  '-'  | ^              R4                            |
|           |          .+.     .+/                                             |
|           |          | |     |/|                                             |
|           |        Rm| |     | |Rv                                           |
|           |          '+'    /'+'                                             |
|           |           |       |                                              |
|           +-----------o-------o                                              |
|                                                                              |
'------------------------------------------------------------------------------'
#+END_SRC

Type C-c C-c and get:

Now, you can finally make use of the Insert-Key or the Emacs picture-mode (in conjunction with M-x untabify).

Finally, another goody: LiaScript implements a fork of SvgBob written in Elm and supports the same syntax – even in conjunction with gapped text exercises!