PlantUML

Yet another Recursive Rabbit-hole! (Yarr)

Sooooo when writing the post about the Tracker, I wanted to draw the class diagram for the Tracker, and naturally I wondered: “Hmm did anyone write some kind of markdown for diagrams?” … i have soooo many open browser tabs ATM… and yes someone did

Enter PlantUML

PlantUml Plantuml is a text -> svg (and others) processor, and a jekyll plugin exist to allow you to simply write text uml and get the svg generated and embedded.


{% plantuml %}

User -> (.markdown)
(.markdown) -> (Jekyll)

(plantUML) -> (Jekyll)

(Jekyll) -> (html)
(Jekyll) -> (svg)
(svg) -> (d6.dk)
(html) -> (d6.dk)

{% endplantuml %}

Fight!

So I have been fighting to get PlantUML to work. Java is installed and the jar file is downloaded. A bat file is created, Path is set up, plugin in Jekyll is installed, but still no cigar. What am I missing? Jekyll complains about invalid PlantUML tag. I have tried to do som manual PlantUML parsing, but no luck.

It really does not make sense for me to spend more time on it, but it would be soooo cool :) Still i spend some more time on it. I also installed GraphViz but i’m not sure it was really needed for what I wanted to do

I had to tweak the plugin in two ways to get it to work. It relies on a plantuml command in path which i could not get to work, so i changed it to directly using the jar file. Secondly the html generated did not render well. Here is an example of what it can do. I did the change directly in the ruby file of the jekyll plugin, so I better document that well as it will go by by when I update.

Code plugin

There is a VS Code plugin I have not looked at yet but intend to:

https://marketplace.visualstudio.com/items?itemName=jebbs.plantum

Resources

https://www.sitepoint.com/add-svg-to-web-page/

https://graphviz.gitlab.io/_pages/Download/Download_windows.html

https://github.com/yegor256/jekyll-plantuml

https://blog.anoff.io/2018-07-31-diagrams-with-plantuml/

https://marketplace.visualstudio.com/items?itemName=jebbs.plantuml

http://plantuml.com/guide