Personen: Alle Nutzer
Pläne: Alle Pläne
Plattformen: Browser, Desktop
Mermaid-Diagramme sind jetzt nativ in Miro verfügbar. Sieh dir Mermaid-Diagramme erstellen an.
Mit der Mermaid-App kannst du ganz einfach umfangreiche, codebasierte Diagramme direkt in deine Miro-Boards erstellen und einbetten. So kannst du komplexe Systeme, Workflows oder Datenstrukturen mit einer einfachen, textbasierten Syntax visualisieren und so die Zusammenarbeit und das Verständnis verbessern.
Einen Diagrammcode ändern und die Vorschau in Echtzeit aktualisiert sehen
Installiere die Mermaid-App
Du kannst die Mermaid-App im Miro Marketplace oder direkt über die Erstellungssymbolleiste in einem Miro-Board installieren.
So installierst du sie vom Miro Marketplace:
- Rufe den Miro Marketplace auf oder folge diesem direkten Link zur Mermaid-App.
- Wähle ein Miro-Team aus, um die Installation abzuschließen.
Du kannst die App auch über die Erstellungssymbolleiste installieren:
- Wähle in der Erstellungssymbolleiste links auf deinem Board Tools, Medien und Integrationen (+) aus. Das Feld Tools, Medien und Integrationen wird geöffnet.
- Suche im Tools-Tab nach Mermaid Diagrams und wähle diese Option aus.
- Das Feld Mermaid Diagrams wird geöffnet, und die App wird deiner Symbolleiste hinzugefügt.
✏️ Hinweis: Nicht-Admin-Nutzer können keine Apps installieren, wenn dies in den Teameinstellungen nicht erlaubt ist.
Diagramme erstellen und zu Miro-Boards hinzufügen
Sobald die Mermaid-App installiert ist, kannst du Diagramme aus textbasiertem Code erstellen und sie als Bilder auf dein Board hinzufügen.
Nach der Installation findest du die Mermaid-App in deiner Erstellungssymbolleiste. Die App öffnet sich mit einem Standard-Beispielcode. Wenn du den Code zur Erstellung deines Diagramms änderst, wird das Diagramm im Vorschaubereich auf der rechten Seite aktualisiert, sodass du deine Änderungen in Echtzeit sehen kannst.
Die Mermaid-App enthält mehrere Beispieldiagramme, die du in der unteren linken Ecke des App-Felds findest. Du kannst eines dieser Beispiele auswählen und es anschließend an deine Bedürfnisse anpassen.
Du kannst die Größe des Code-Editor-Panels ändern, indem du dessen rechten Rand ziehst.
Größe des Code-Editor-Panels ändern
Wenn du dein Diagramm fertiggestellt hast, klicke auf Zum Board hinzufügen. Das Diagramm wird deinem Board als Bild hinzugefügt.
Hinzufügen eines Diagramms zum Board
Vorhandene Diagramme bearbeiten
Du kannst Mermaid-Diagramme bearbeiten, die sich bereits auf deinem Miro-Board befinden.
- Klicke auf das Mermaid-Diagramm auf deinem Miro-Board, um es auszuwählen.
- Klicke auf das Mermaid-Symbol im angezeigten Kontextmenü (oder finde es in der Erstellungssymbolleiste).
- Der Mermaid-Editor wird mit dem Code des Diagramms geöffnet. Nimm deine Änderungen im Code-Editor vor.
- Klicke auf Diagramm aktualisieren.
- Du kehrst zu deinem Miro-Board zurück, und das Diagramm auf dem Board wird mit deinen Änderungen aktualisiert.
Zusätzliche Informationen
Hier findest du weitere Ressourcen und Informationen zur Arbeit mit Mermaid-Diagrammen in Miro.
Mermaid-Syntax und Dokumentation
Die Mermaid-App verwendet eine bestimmte Syntax, um Diagramme aus Text zu erstellen. Detaillierte Informationen zur Syntax, einschließlich der unterstützten Diagrammtypen und Optionen, findest du in der offiziellen Mermaid-Dokumentation. Du kannst außerdem über den Link in der linken unteren Ecke des Mermaid-App-Felds innerhalb von Miro auf diese Dokumentation zugreifen.
Diagramme freigeben und exportieren
Sobald ein Mermaid-Diagramm zu deinem Board hinzugefügt wurde, verhält es sich wie ein Bild. Du kannst dieses Bild bei Bedarf direkt vom Board herunterladen. Um mit anderen zusammenzuarbeiten, kannst du das Miro-Board mit dem Diagramm freigeben.
Datenverarbeitung
Beim Erstellen oder Bearbeiten eines Mermaid-Diagramms wird der Code clientseitig in deinem Browser mit der Mermaid.js-Bibliothek gerendert. Das erzeugte Diagrammbild wird dann als Teil des Inhalts deines Boards auf Miro-Servern gespeichert. Dein Diagrammcode wird nicht an einen externen Server zum Rendern gesendet.
Sowohl der ursprüngliche Diagrammcode als auch das daraus resultierende Bild werden in den Widgets des Miro-Boards eingebettet, genauso wie andere Inhalte des Boards. Damit ist die volle Kompatibilität mit den Zusammenarbeits- und Inhaltsverwaltungsfunktionen von Miro gewährleistet.
Alle Daten verbleiben vollständig innerhalb der Miro-Infrastruktur – nichts wird außerhalb der Miro-Umgebung freigegeben oder übertragen. Alle durch die App erstellten Daten werden mit den Enterprise Key Management (EKM)-Schlüsseln des Kunden verschlüsselt.