Diagramme mit PlantUML

Diagramme mit PlantUML
Page content

PlantUML ist ein Werkzeug, um Diagramme aus Code zu erzeugen. Den großen Vorteil sehe ich in zwei Punkten:

  1. Das Diagramm ist als Code (Klartext) vorhanden und kann zusammen mit dem Projekt in einer Versionsverwaltung abgelegt werden
  2. Es entfällt das “Pixelschubsen”, weil das Programm den Inhalt automatisch generiert und anordnet

Wir schauen uns anhand eines Sequenzdiagramms die Syntax von PlantUML genauer an. PlantUML unterstützt verschiedenste UML-Typen wie Sequenz-, Anwendungsfall- oder Klassendiagramm.

Installation und Einrichtung

Online Service

Der einfachste Weg, um PlantUML auszuprobieren, ist die Verwendung der interaktiven Webseite. Diese wird von PlantUML bereitgestellt: https://plantuml.com/plantuml

Docker

Als zweite Möglichkeit kann der PlantUML-Server lokal via Docker ausgeführt und ausprobiert werden.

docker run -d -p 8080:8080 plantuml/plantuml-server:jetty
docker run -d -p 8080:8080 plantuml/plantuml-server:tomcat

Java

Nachdem GraphViz und Java installiert wurden, lädt man sich die plantuml.jar -Datei herunter. Durch einen Aufruf mit der Kommandozeile erstellt diese aus dem Diagramm ein Bild:

java -jar plantuml.jar myDiagram.txt

Aufbau und Beispiele

Bei einem Sequenzdiagramm werden die Interaktionen zwischen zwei oder mehreren Systemen grafisch dargestellt. Mit Hilfe von Pfeilen geben wir an, welches System andere Systeme aufruft. Der Aufruf kann synchron (warten auf Rückgabewert) oder asynchron (Ereignisse) sein.

Ein Sequenzdiagramm sieht folgendermaßen aus:

@startuml
Participant Client as A
Participant Server as B
Database "SQL-Database" as C

A -> B: Send: Ping
A <- B: Send: Pong

A -> B: Request: Get user(id)
activate B
B -> C: Get user from database by id
note right of C
  id is a GUID
endnote

B <- C:
B -> B: Check data, create response
A <- B: Send user
deactivate B
@enduml
Das UML-Diagramm als Grafik

Das UML-Diagramm als Grafik

Die Definition am Anfang ist optional. Der Vorteil hierbei ist, dass die angezeigten Namen an einer zentralen Stelle dokumentiert sind. Bei Änderungen am Typ oder dem Namen muss nur eine Stelle angepasst werden. Zudem erhalten wir dadurch die Möglichkeit den Typen zu definieren. Der Typ wird im Diagramm durch ein entsprechendes Symbol dargestellt.

Durch Pfeile legen wir die Kommunikationsrichtungen fest. Hinter dem Doppelpunkt geben wir eine Beschriftung für die Pfeile an.

Erweiterte Funktionen

Kopf- und Fußzeile

Die Bilder können eine Kopfzeile, Fußzeile und Titel beinhalten. Hierzu schreiben wir in den Code _ header, footer_ oder title. Dahinter steht der Text, welcher im Diagramm platziert werden soll.

@startuml
header Kopfzeile von diesem Diagramm
footer Dies ist die Fußzeile, welche etwas länger als das Diagramm ist um\nzu zeigen, dass das Diagramm angepasst wird und auch ein Zeilenumbruch möglich ist
title Client-Server Kommunikation

Client -> Server: Send: Ping
Client <- Server: Send: Pong
@enduml
UML-Diagramm mit Kopf- und Fußzeile

UML-Diagramm mit Kopf- und Fußzeile

Variablen und Funktionen

PlantUML erlaubt das Verwenden von Funktionen und Variablen . Es gibt eingebaute Funktionen wie %date, welche das aktuelle Datum ausgibt. Mit den Befehlen !while und !endwhile werden Schleifen definiert. Es gibt auch Befehle um Bedingungen (!if) anzulegen oder sogar eigene Funktionen zu schreiben.

Eigene Variablen werden mit Ausrufungszeichen-Dollar definiert. Beispiel: !$NameDerVariablenUm den Wert auszugeben schreiben wir $NameDerVariablen ohne das Ausrufungszeichen am Anfang. Ein Diagramm mit Variablen kann folgendermaßen aussehen:

@startuml
!$counter = 1

title Diagramm mit Variablen
footer Diagramm erstellt am %date("d. MMM. yyyy")

!while $counter <= 3
  Client -> Server: Send: Ping($counter)
  !$counter = $counter + 1
!endwhile
@enduml
Ein UML-Diagramm mit Variablen und Schleifen

Ein UML-Diagramm mit Variablen und Schleifen

Hier wird eine Variable counter angelegt und in der Schleife inkrementiert. Die Variable counter wird als Parameter für die Beschriftung der Ping-Aufrufe verwendet.

Fazit

PlantUML unterstützt viele verschiedene Diagramme und die Dokumentation bietet sehr viele Möglichkeiten und Informationen, um das Diagramm den eignen Wünschen anzupassen.In der Darstellung ist man etwas beschränkt, dafür kann das Diagramm durch Text definiert und automatisch generiert werden. Das händische “Pixelschubsen” für Diagramme entfällt.Wie ist eure Erfahrung und Meinung mit solchen Generatoren für Diagramme?


Bildnachweis: Pixabay.com