Het PlantUML-formaat begrijpen

Wat is PlantUML?

PlantUML is een open-source tool waarmee je diagrammen kunt maken vanuit platte tekstbeschrijvingen. In plaats van vakjes over een canvas te slepen, schrijf je een paar regels eenvoudige syntax en PlantUML genereert een professioneel diagram voor je. Deze aanpak wordt vaak "diagram als code" of "tekst naar diagram" genoemd.

Een minimaal PlantUML-diagram ziet er zo uit: je opent met een @start<type>-tag, beschrijft de structuur in een paar leesbare regels en sluit af met @end<type>. De tool parseert deze tekst en produceert een SVG, PNG of PDF — waar je het ook rendert.

Waarom diagrammen als tekst schrijven?

• Versiebeheer — Platte tekst diff't netjes in Git. Je kunt elke wijziging aan een diagram volgen, beoordelen in een pull request en terugdraaien als er iets misgaat.
• Snelheid — [Taak A] lasts 5 days typen is sneller dan een balk op een canvas tekenen en vergroten.
• Consistentie — De render-engine past automatisch uniforme afstand, lettertypen en kleuren toe. Jij richt je op de inhoud, niet op de lay-out.
• Portabiliteit — Een .puml-tekstbestand is klein, menselijk leesbaar en rendert overal hetzelfde.
• Automatisering — Diagrammen kunnen programmatisch worden gegenereerd uit data, ingebed in CI-pipelines en gesynchroniseerd blijven met code.

Hoe GanttTool PlantUML gebruikt

GanttTool geeft je een visuele GUI-editor — je voegt taken toe, stelt tijdsduren in, definieert afhankelijkheden, kiest kleuren — maar achter de schermen wordt alles wat je bouwt gecompileerd naar PlantUML-code. Die code wordt vervolgens naar een renderserver gestuurd die deze omzet in een SVG-diagram dat in je browser wordt weergegeven.

De renderpipeline

De API-route op /api/kroki fungeert als een proxy tussen je browser en de renderservers. Het werkt in twee fasen:

• Primair: PlantUML.com-server — De PlantUML-code wordt gecomprimeerd met Deflate (niveau 9) en gecodeerd met PlantUML's eigen base-64-variant. De resulterende string wordt toegevoegd aan https://www.plantuml.com/plantuml/svg/~1{gecodeerd} als een GET-verzoek. Een time-out van 3 seconden vangt trage reacties op.
• Fallback: Kroki.io-server — Als PlantUML.com faalt of een time-out geeft, wordt de ruwe PlantUML-tekst als text/plain gepost naar https://kroki.io/plantuml/svg met een time-out van 5 seconden. Kroki is een open-source rendering gateway die veel diagramformaten ondersteunt.

Welke server als eerste reageert met een geldige SVG, die afbeelding wordt teruggestuurd naar de browser met een Content-Type: image/svg+xml-header en inline weergegeven. Je hoeft nooit na te denken over codering of fallback — het werkt gewoon.

PlantUML Gantt-diagram Syntax

Elk PlantUML Gantt-diagram wordt ingepakt in @startgantt / @endgantt-tags. Daarbinnen beschrijf je je project in een natuurlijke, leesbare stijl.

Basis taakstructuur

@startgantt
' Projecttitel en schaal
title Website Redesign Project
Project starts 2026-07-01
printscale weekly

' Fase-scheidingsteken
-- Discovery --

' Gewone taken: [Naam] lasts N days
[Requirements gathering] lasts 5 days
[Competitor analysis] lasts 3 days

-- Design --

[Wireframes] lasts 7 days
[Visual design] lasts 10 days
[Visual design] starts at [Wireframes]'s end

-- Development --

[Frontend build] lasts 14 days
[Frontend build] starts at [Visual design]'s end
[Backend integration] lasts 10 days
[Backend integration] starts at [Frontend build]'s end

@endgantt

Mijlpalen

Mijlpalen hebben een duur van nul en verschijnen als een ruitmarkering op de tijdlijn. Definieer ze met happens at in plaats van lasts.

@startgantt
Project starts 2026-07-01

[Development] lasts 14 days and is colored in CornflowerBlue
[QA Testing] lasts 5 days and is colored in LightGreen
[QA Testing] starts at [Development]'s end

' Mijlpaal — vindt plaats aan het einde van een specifieke taak
[Release v1.0] happens at [QA Testing]'s end

' Voltooiingspercentage
[Development] is 70% completed

@endgantt

Fase-scheidingstekens & projectinstellingen

Zet sectienamen tussen dubbele streepjes (-- Fase naam --) om een scheidingsrij in te voegen. Combineer met projectbrede instellingen voor volledige controle.

@startgantt
title Q3 Product Launch
Project starts 2026-07-01
printscale weekly zoom 2
saturday are closed
sunday are closed
today is colored in Lavender

-- Planning --
[Kickoff meeting] lasts 1 day
[Scope definition] lasts 3 days
[Scope definition] starts at [Kickoff meeting]'s end

-- Build --
[Engineering sprint 1] lasts 10 days
[Engineering sprint 1] starts at [Scope definition]'s end
[Engineering sprint 2] lasts 10 days
[Engineering sprint 2] starts at [Engineering sprint 1]'s end

-- Launch --
[Smoke testing] lasts 2 days
[Smoke testing] starts at [Engineering sprint 2]'s end
[Go live] happens at [Smoke testing]'s end

@endgantt

Belangrijke Gantt-syntax in één oogopslag

PlantUML voorbij Gantt-diagrammen

Gantt is slechts een van meer dan een dozijn diagramtypes die PlantUML ondersteunt. Dezelfde platte-tekst-filosofie — starttag, beschrijving, eindtag — geldt voor allemaal. Hier is een rondleiding langs de meest gebruikte types.

@startuml
title User Login Flow

Browser -> API: POST /login {email, password}
API -> Database: SELECT user WHERE email=?
Database --> API: user record
alt valid credentials
    API --> Browser: 200 OK + JWT token
else invalid
    API --> Browser: 401 Unauthorized
end
@enduml

@startuml
class Project {
    +id: String
    +name: String
    +startDate: Date
    +getTasks(): Task[]
}

class Task {
    +id: String
    +name: String
    +duration: Number
    +complete(): void
}

class Milestone {
    +name: String
    +date: Date
}

Project "1" o-- "many" Task
Project "1" o-- "many" Milestone
Task <|-- Milestone
@enduml

Meer PlantUML-diagramtypes

Hier is een snel voorbeeld van een PlantUML-mindmap om te illustreren hoe niet-Gantt-diagrammen dezelfde tekst-eerst-filosofie volgen:

@startmindmap
* Project Planning
** Scope
*** Requirements
*** Deliverables
** Schedule
*** Gantt chart
*** Milestones
** Team
*** Roles
*** Resources
** Risks
*** Mitigation plan
@endmindmap

Probeer PlantUML online

Je hoeft niets te installeren om met PlantUML te beginnen experimenteren. Het ecosysteem heeft uitstekende gratis online renderers:

Begin met het maken van Gantt-diagrammen

GanttTool geeft je de kracht van PlantUML zonder dat je ook maar één regel code hoeft te schrijven. Gebruik de visuele editor om je projectplanning op te bouwen en laat de app de PlantUML-syntax en diagramrendering automatisch afhandelen.

• Voeg taken, mijlpalen en fasescheidingstekens toe met één klik.
• Stel tijdsduren, afhankelijkheden, kleuren en voltooiingspercentages visueel in.
• Bekijk de gegenereerde PlantUML-code op elk moment — kopieer en hergebruik deze overal.
• Exporteer als SVG of kopieer naar het klembord als PNG voor presentaties en documenten.
• Beschrijf je project in gewoon Nederlands en laat de AI-assistent een volledig Gantt-concept genereren.