Supporto Mermaid

Diagrammix3 supporta l'importazione e l'esportazione di diagrammi utilizzando la sintassi Mermaid, un popolare linguaggio di creazione diagrammi basato su testo.

Cos'è Mermaid?

Mermaid è uno strumento di creazione diagrammi basato su JavaScript che utilizza una sintassi simile a Markdown per definire i diagrammi. È comunemente usato nella documentazione, nei wiki e nei file README.

Esempio di sintassi Mermaid:

flowchart LR
    A[Start] --> B{Decision}
    B -->|Yes| C[Action]
    B -->|No| D[End]

Importare Diagrammi Mermaid

Dagli appunti

1. Copia la sintassi Mermaid negli appunti
2. In Diagrammix3, vai su File → Import → Mermaid from Clipboard
3. Il diagramma verrà creato sulla tua tela

Da file

1. Vai su File → Import → Mermaid File...
2. Seleziona un file .mmd o .mermaid
3. Il diagramma verrà importato sulla tua tela

Tipi di diagrammi supportati

Sintassi dei diagrammi di stato

I diagrammi di stato modellano gli stati in cui un oggetto può trovarsi e le transizioni tra gli stati.

Diagramma di stato base:

stateDiagram-v2
    [*] --> Active
    Active --> Inactive : deactivate
    Inactive --> Active : activate
    Active --> [*] : terminate

Stati e transizioni:

• [*] rappresenta gli stati iniziale e finale
• --> crea una freccia di transizione
• : label aggiunge etichette alle transizioni
• Gli stati annidati usano l'indentazione

Stati composti:

stateDiagram-v2
    state Processing {
        [*] --> Validating
        Validating --> Executing
        Executing --> [*]
    }

Risultato: Un diagramma macchina a stati con forme di stato appropriate e transizioni etichettate.

Esempi di Importazione

Diagramma di flusso

Input Mermaid:

flowchart TD
    A[Hard edge] -->|Link text| B(Round edge)
    B --> C{Decision}
    C -->|One| D[Result one]
    C -->|Two| E[Result two]

Risultato: Un diagramma di flusso dall'alto verso il basso con forme rettangolari, rettangoli arrotondati e rombi collegati con frecce etichettate.

Diagramma di sequenza

Input Mermaid:

sequenceDiagram
    participant A as Alice
    participant B as Bob
    A->>B: Hello Bob!
    B-->>A: Hi Alice!

Risultato: Un diagramma di sequenza con due partecipanti e frecce di messaggio.

Diagramma delle classi

Input Mermaid:

classDiagram
    Animal <|-- Duck
    Animal <|-- Fish
    Animal : +int age
    Animal : +String gender
    Animal: +isMammal()

Risultato: Un diagramma delle classi UML con relazioni di ereditarietà.

Esportare in Mermaid

Esportare il diagramma corrente

1. Vai su File → Export → Mermaid...
2. Scegli una posizione di salvataggio
3. Il diagramma viene esportato come file .mmd

Copiare come Mermaid

1. Seleziona le forme che vuoi esportare (oppure seleziona tutto con Cmd+A)
2. Vai su Edit → Copy as Mermaid
3. Incolla la sintassi Mermaid dove ti serve

Modificare i Diagrammi Importati

Una volta importati, i diagrammi Mermaid diventano oggetti nativi di Diagrammix. Puoi:

• Spostare e ridimensionare le forme liberamente
• Cambiare gli stili usando l'Inspector (colori, font, stili di linea)
• Aggiungere nuovi elementi usando gli strumenti di Diagrammix
• Modificare le connessioni trascinando i punti finali
• Applicare il layout automatico per riorganizzare il diagramma

Il collegamento con il sorgente Mermaid originale non viene mantenuto — le modifiche vengono apportate direttamente agli oggetti del diagramma.

Limitazioni

• Stili complessi: Le direttive di stile Mermaid potrebbero non tradursi completamente
• Sottografi: Convertiti in forme raggruppate
• Funzionalità avanzate: Alcune funzionalità specifiche di Mermaid (come i gestori di clic) vengono ignorate
• Andata e ritorno: L'esportazione di un diagramma importato potrebbe non produrre una sintassi Mermaid identica

Suggerimenti

1. Pulisci dopo l'importazione: Usa il layout automatico per organizzare i diagrammi importati
2. Verifica le relazioni: Controlla che i tipi di relazione siano stati importati correttamente
3. Stili coerenti: Applica gli stili di Diagrammix per un aspetto curato
4. Conserva i sorgenti: Salva i tuoi file Mermaid originali per il controllo di versione