How to edit embedded draw.io diagrams outside of Confluence?

At the Square Kilometre Array we use Atlassian’s Confluence as the main knowledge sharing and managing application. Confluence is a wiki with several additions and integrations with other Atlassian products, such as JIRA, and the ability to use macros from different vendors to achieve different goals.
One of the available macros is the draw.io Diagrams for Confluence macro. draw.io (now diagrams.net) is an online application for diagraming, and as you can imaging is very useful in an engineering setting. The draw.io macro provides you a full draw.io experience within Confluence.
However, sometimes you might want to be able to get a diagram originated in Confluence to be able to edit it offline with the draw.io desktop application, or you might want to share it with a different audience and collaborate with it directly from draw.io online.
You need to follow these steps:
  1. You need to get the draw.io file from Confluence. The draw.io macro stores two attachments in confluence: a preview of the diagram in Portable Network Graphics (PNG) format, and the actual drawio original format (which is an XML that contains a quoted, deflated, and base64 encoded XML shapes… but that is another story). If your diagram, for instance, is called Figure1, you will have two attachments: Figure1.png, and Figure1. Click on the disclosure triangle that appears to the left of Figure1, and click on the latest version (the one that is suffixed with current). For instance, assuming you have two versions, click on Version 2 (current) under Figure1. You will get a file called Figure1, with no extension.
  2. Rename the file by adding the .drawio extension. That way, in your filesystem the file that was called Figure1 now is called Figure1.drawio.
  3. You can edit the file using draw.io in the web by going to https://draw.io, and then using File > Import… to get the file from your filesystem, or you can double click the file if you had already downloaded the draw.io desktop application, and edit it offline.

Once finished, to import the changes back in Confluence, you need to:

  1. Open the diagram in Confluence by double clicking on the diagram on the relevant page, selecting everything and removing it.
  2. If you used the draw.io desktop application, you will the use File > Import… to import your modified Figure1.drawio file.
  3. If you used the online version, you will need to get the .drawio file from either Google Drive, Dropbox, Box, OneDrive, or whichever online service it was using as a backend. From Google Drive, you will need to use the drive.google.com interface to be able to download the file, instead of opening it.
  1. Click Save & Exit for the changes to stick.
After that process, you will have an updated version of the diagram in Confluence.
Happy confluent diagramming!

Descubre más desde Memoria de Acceso Aleatorio

Suscríbete ahora para seguir leyendo y obtener acceso al archivo completo.

Seguir leyendo