Vai al contenuto

Diagrammi come codice

Il metodo viene dalla guida di docs.nordbye.it. Qui sono annotate le differenze e gli inciampi incontrati applicandolo.

In breve

  • Ogni diagramma è un file di testo D2, impaginato con ELK.
  • La generazione gira in Docker: sulla macchina non si installa D2.
  • Sulle schede solo nome e icona. Indirizzi e porte stanno nelle pagine, scritti una volta sola.
  • I gruppi sono livelli, dall'esterno verso l'interno, e le linee vanno da gruppo a gruppo.

Inciampi

Griglie deformate. Con il solo grid-columns D2 distribuisce le schede bilanciando le colonne, e un gruppo con un numero dispari di schede si deforma. Indicando anche grid-rows la griglia resta regolare.

Limite di richieste per le icone. Scaricare decine di icone a ogni generazione porta a risposte 429. Conviene scaricarle una volta, tenerle nel repository e riferirle con un percorso locale.

Tema chiaro e scuro. Lo stile sta in un file a parte, importato da ogni diagramma. La versione scura si ottiene sostituendo i colori con uno script e generando ogni diagramma due volte.

PNG e caratteri. rsvg-convert non usa il carattere incorporato nell'SVG: il PNG esce con un carattere di ripiego. Per il sito si usa l'SVG.

Linee verso una scheda. Una linea che entra in una singola scheda di un gruppo a griglia impedisce l'impilamento dei livelli.

Tenerli allineati

Uno script elenca i container in esecuzione su ogni nodo e li confronta con le etichette delle schede. Due file di testo guidano il confronto: uno per ciò che va ignorato (database, cache, agent), uno per i nomi che non si somigliano. Il risultato è un elenco di ciò che gira ma non è disegnato, e di ciò che è disegnato ma non gira.