Disegno di grafi
Scrivi i collegamenti a sinistra, uno per riga, e il grafo si disegna da solo a destra. Si salva mentre scrivi, e se lo rendi pubblico chiunque abbia il link può guardarlo e modificarlo con te.
[[ t.loading ]]
[[ t.gate_title ]]
[[ gateText ]]
[[ t.notfound_title ]]
[[ t.notfound_text ]]
[[ t.local_note ]]
[[ t.gone ]]
[[ t.errors_title ]]
[[ t.renderer_loading ]]
[[ t.renderer_error ]]
[[ t.empty ]]
[[ view === 'normal' ? t.viewer_help : t.view_exit ]]
Come funziona
Sintassi
La prima riga dice la direzione del grafo. Poi una riga per ogni collegamento. Il nome di un nodo può contenere quasi tutto (lettere accentate, apostrofi, virgole, trattini) tranne spazi, parentesi e i caratteri ; " | < > &: per gli spazi usa _ oppure un testo tra quadre, A[Il mio nodo]. Il primo nodo che scrivi sta all'inizio, gli altri vanno verso destra (o verso il basso).
| flowchart LR | Direzione: LR da sinistra a destra, RL al contrario, TD o TB dall'alto in basso, BT dal basso in alto. |
| A --> B | Freccia continua da A a B. |
| A -.-> B | Freccia tratteggiata. |
| A --> B --> C | Più frecce di fila. |
| A[Testo del nodo] | Il nodo A mostra un testo diverso dal nome. |
| %% nota | Commento: la riga non viene disegnata. |
| %%{init: {"flowchart": {"nodeSpacing": 40, "rankSpacing": 80, "groupSpacing": 30}}}%% | Spaziatura in pixel, di solito in prima riga. nodeSpacing: tra nodi della stessa colonna. rankSpacing: tra le colonne. groupSpacing: spazio in più tra gruppi di figli di nodi diversi. Puoi metterne anche solo una. Con "lineJumps": false gli archi che si incrociano non fanno il salto. |
Il disegno lo fa Graphviz (l'algoritmo dot, a livelli), che gira nel tuo browser. Mette i nodi in colonne, cerca di incrociare il meno possibile le frecce e funziona anche con i cicli: il primo nodo resta comunque all'inizio.
Se i nodi di rami diversi finiscono troppo vicini, usa groupSpacing: i figli dello stesso nodo restano raccolti e tra un gruppo e l'altro si apre lo spazio che scegli. Le colonne si allargano un po', ma rankSpacing lo compensa. Testo e grafo si possono copiare e scaricare: SVG per stamparlo o modificarlo, PNG per incollarlo dove serve un'immagine.
Salvataggio e limiti
Serve un account gratuito. Il grafo si salva da solo 3 secondi dopo che hai smesso di scrivere; in alto vedi se ci sono modifiche non ancora salvate. Ogni account può tenere fino a 5 grafi da 100 KB di testo l'uno. Un grafo che nessuno modifica per 6 mesi viene cancellato.
Condividere e lavorare insieme
Di base un grafo lo vedi solo tu. Con l'interruttore "Pubblico" chiunque abbia il link può vederlo e modificarlo, anche senza account; solo tu puoi cambiare il titolo, renderlo di nuovo privato o cancellarlo. Il link contiene un identificativo casuale, non indovinabile.
Ogni 5 secondi la pagina controlla se qualcun altro ha salvato. Se avete toccato righe diverse le modifiche si uniscono da sole. Se avete cambiato la stessa riga si tengono tutte e due le versioni, una sotto l'altra: niente va perso, al massimo c'è una freccia in più da cancellare.