Edit online

Creating Link Graphs From DITA Maps

2 Sep 2021
Read time: 3 minute(s)
It may be sometimes useful as an overview to obtain a graphical visualization of how your DITA topics refer to each other. The VisJS Javascript library can be used to construct node network diagrams. Here's how you can use it for your DITA project:
  1. Open the main DITA Map in the Oxygen XML Editor DITA Maps Manager view, use the Configure Transformation Scenarios button, then create a new transformation scenario of type DITA OT Transformation choosing the Merge DITA Content to Single XML file transformation type. If you are not using Oxygen XML Editor you can download and install the dita-merge plugin separately from Github.
  2. Apply the new transformation scenario on the DITA Map, once the merged XML document is generated, create another transformation scenario of type XML transformation with XSLT and transform to HTML using the XSLT stylesheet: https://github.com/oxygenxml/dita-merged/blob/master/possible-applications/createHTMLVisGraph.xsl
  3. Open the result HTML document in a web browser. Depending on the complexity of the DITA project it may take some time for the diagram to show up. As an example the related links section below contains a reference to a diagram representation of the Oxygen XML Blog. If we regard the diagram as a circle, on the outer bounds of the circle are topics which have few incoming and outgoing links and in the center topics which have many outgoing and incoming links. Links from the DITA Map to the topics are not taken into account. You can interact with the diagram by dragging nodes and by using the mouse wheel to zoom in or out.