Lo que he aprendido: diagramas en Org mode con Ditaa

¡He aprendido cosas nuevas de Org! ¡Ahora puedo pintar grafiquillos! Cómo me encanta. Me encontré con Ditaa leyendo el curso de Emacs de La pipa plena, un gran recurso para aprender, luego me puse yo a hurgar y ahora me toca escribir lo aprendido para que no se me olvide. Vamos a ello.

Ditaa

Ditaa es una pequeña utilidad para la terminal que permite convertir diagramas hechos en ASCII art en imágenes. Está escrita en Java y se distribuye como un archivo jar por lo que es totalmente portable1. Es además un programilla libre ya que lleva una licencia GPL.

Si tenemos el jar necesitamos Java para poder crear diagramas desde la terminal, pero no nos preocupemos, usarlo es tan fácil como llamar a Java con la opción -jar diciéndole dónde está Ditaa y qué queremos que haga:

java -jar RUTA/ditaaXXX.jar OPCIONES ARCHIVO

donde XXX es el número de versión y ARCHIVO el lugar donde está el dibujito ASCII, lo demás creo que se explica solo. Por poner un ejemplo, si le pasamos a Ditaa un archivo que contenga esto:

+----------------+       +----------------+
|                |       |                |
| Primer bloque  +------>| Segundo bloque |
|                |       |                |
+----------------+       +----------------+

Nos creará este gráfico:

figura

Unirlo a Emacs

Así visto Ditaa parece un poco absurdo, pero ¿y si lo unimos al modo artista de Emacs? Más aun, ¿y si le decimos a Org que nos ejecute el código de Ditaa? ¡Nos aparecerá un gráfico perfectamente integrado en nuestro documento!

Cuenta la leyenda que Ditaa viene en el propio Org, concretamente el jar debería estar en contrib/scripts, pero yo no lo tenía, no sé por qué, así que tuve que decirle a Emacs dónde estaba añadiendo lo siguiente al archivo de configuración:

;; Ruta hasta el jar de Ditaa
(setq org-ditaa-jar-path "RUTA/ditaaXXX.jar")

Luego tuve que permitirle a Org ejecutar Ditaa, para ello añadí también al archivo de configuración:

;; Permitir a org-mode que ejecute Ditaa
(org-babel-do-load-languages
(quote org-babel-load-languages)
(quote (
(ditaa . t)
)))

Con esto pude usar Ditaa desde dentro de Org.

Bloques Ditaa en Org

Ahora ya se pueden añadir bloques de código de Ditaa como si fuera cualquier otro lenguaje de programación y ejecutarlos luego para que nos genere la imagen. Yo activo el modo artista (M-x artist-mode), pinto mi dibujo y luego lo rodeo con los delimitadores de código fuente de Org. Cogiendo el ejemplo anterior:

#+BEGIN_SRC ditaa :file figura.png :cmdline -o -e UTF8 -r

+----------------+       +----------------+
|                |       |                |
| Primer bloque  +------>| Segundo bloque |
|                |       |                |
+----------------+       +----------------+

#+END_SRC

Al ejecutar el bloque de código con C-c C-c sale una línea de resultados con un enlace a la figura recién creada, cuyo nombre le hemos dado tras :file:

#+RESULTS:
[[file:figura.png]]

Por cierto, detrás de la etiqueta :cmdline le metemos las opciones que añadiríamos al comando en la terminal, en este caso yo le he pedido que sobreescriba la imagen si ya existe (-o, overwrite), que use codificación UTF8 (-e, encoding) y que use bordes redondeados (-r, rounded).

Lo mejor del tema es que si exportamos el documento a pdf o HTML lleva consigo la figura, con lo que resulta bastante práctico para tomar notas y luego producir un resultado vistoso.

¿Qué os parece el truquillo? A mí me hace amar más el modo Org.

Referencias

Ditaa

Curso emacs 20. Gráficos con org-mode (ditaa y plantuml) en La Pipa Plena

ASCII art diagrams in Emacs org-mode

Setting up Ditaa in Org-mode en StackExchange


Suena mientras pienso:


  1. También está en los repositorios pero yo voy a usar el archivo portable porque últimamente funciono en dos sistemas operativos y prefiero una configuración a dos. 
Anuncios

13 pensamientos en “Lo que he aprendido: diagramas en Org mode con Ditaa

  1. softlibrelibre

    ¡¡¡Muy bueno!!!

    ¿Probaste usar dot? Es para hacer grafos, árboles y otros diagramas. Su sintaxis no es ASCIIart, pero sí es muy simple. Está pensado para usarlo en scripting, para mostrar resultados en imágenes (por ejemplo: qué orgs y sus links vinculan con otros orgs). De hecho, doxygen puede usar dot para mostrar diagramas de clases UML.

    Me gusta

    Responder
  2. Pingback: Lo que he aprendido: imágenes inline en Org | Onda Hostil

  3. Pingback: Lo que he aprendido: diagramas de Gantt en PlantUML | Onda Hostil

¡Opina sin miedo! (Puedes usar Markdown)

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s