Diagram generator

/diagrams genereert visuele architectuurdiagrammen uit de topology data zonder Visio of draw.io. De pijplijn:

topology_nodes + edges + zones
        │
        ▼ scope filter (env / type / id / only_managed)
        │
        ▼ layout engine (hierarchical | force | concentric | zone)
        │
        ▼ styling (env-kleur per node, encryption-kleur per edge)
        │
        ▼ optioneel: Ollama AI-analyse → summary + risks
        │
        ▼ React Flow canvas (drag-to-edit, save with version history)
        │
        ▼ export PNG | SVG | PDF | Mermaid

Layout-algoritmen

Algoritme	Wanneer gebruiken
hierarchical	N-tier architectuur, request flow, firewall → server chains. Coffman-Graham BFS, deterministische sort per laag
force	Mesh netwerken, microservices, organische topologieën. Fruchterman-Reingold, 300 iteraties, kritieke edges trekken 2× sterker
concentric	Blast radius visualisatie, dependency analyse. Focus node in centrum, ringen 1/6/12/18/24
zone	Compliance-documentatie, netwerk-segmentatie. Swimlanes per environment in vaste volgorde (internet → dmz → prod → …)

Diagram types

Type	Filtering
`architecture`	alle nodes (default)
`network_flow`	alle nodes, edges getoond met richting
`dependency`	3-hop BFS vanaf `focus_node_id`
`compliance_zone`	swimlanes per environment, met group rectangles
`blast_radius`	concentric layout vanaf focus node
`data_flow`	alle nodes met traffic_profile=continuous = animated

Templates

5 ingebouwde patterns klaar om te clonen:

3-Tier Web Application — Internet → Firewall → LB → Web Servers → DB
Microservices — API Gateway met 4 backend services + DB
Hub & Spoke Network — centrale hub met 4 branch-locaties via IPsec
Zero Trust Architecture — Identity Provider + IAP + apps + SIEM
DR/Backup Setup — Production + DR replica + offsite S3 + monitoring

POST /api/v1/diagrams/from-template/:id cloont een template als nieuwe diagram.

AI-analyse (Ollama)

Bij include_ai: true doet de generator één Ollama-call met de volledige node + edge lijst plus statistieken (unencrypted edges, critical edges, compliance gaps). De LLM levert:

{
  "summary": "2-3 zinnen samenvatting van de architectuur",
  "risks": [
    { "severity": "high", "description": "…", "remediation": "…" }
  ]
}

Timeout 60 sec, model llama3.1:8b, draait lokaal in dezelfde Docker stack (geen externe AI provider). Bij parse-fout van de LLM-response valt het systeem terug op de raw text als summary.

Export

Formaat	Hoe
PNG	client-side via `html-to-image`, 2× pixelRatio voor retina-kwaliteit
SVG	client-side via `html-to-image`’s `toSvg`
PDF	PNG embed in `jsPDF` op landscape 1920×1080
Mermaid	server-side via `/api/v1/topology/export/mermaid`
Sharing	publieke read-only link via `POST /api/v1/diagrams/:id/share` — 32-char URL-safe token, geen expiry, tenant_id gestript uit response

API

Methode	Pad
`GET /api/v1/diagrams`	lijst diagrams + node/edge counts
`POST /api/v1/diagrams/generate`	layout + style + optionele auto_save
`GET /api/v1/diagrams/templates`	builtin + tenant templates
`POST /api/v1/diagrams/from-template/:id`	clone template
`GET /api/v1/diagrams/:id` · `PUT` · `DELETE`	CRUD met version history bij PUT
`POST /api/v1/diagrams/:id/share` · `unshare`	publieke link toggle
`GET /api/v1/diagrams/share/:token`	publieke (no-auth) read-only

Versie-historiek

Elke PUT /diagrams/:id snapshot de vorige versie naar diagram_versions met change_summary. Geen UI om diff’jes te zien (op de roadmap), maar de data is er voor forensisch herstel.

Beperkingen

Geen real-time samenwerking — meerdere editors tegelijk overschrijven elkaars wijzigingen. Werk per persoon, gebruik snapshots als synchronisatiepunten.
Geen draw.io XML export — Mermaid is wel beschikbaar; draw.io kan Mermaid importeren.
Per-node AI annotaties zijn er nog niet — alleen tenant-niveau summary + risks.
Crossing-minimalisatie — hiërarchische layout doet geen Sugiyama edge-crossing optimalisatie. Voor diagrammen met 50+ nodes adviseren we de zone of force layout.