Skip to main content

​
Mermaid-Diagramme generieren

Verwandle deine Ideen in klare Diagramme mit Mermaid in Langdock. Egal ob du Flussdiagramme, Prozessdiagramme oder Systemarchitekturen brauchst, unsere Modelle erstellen präzise Mermaid-Syntax.
Im Chat ist das Rendern von Mermaid-Diagrammen eingebaut und erfordert kein spezielles Tool. Frage nach einem Diagramm und die Mermaid-Syntax wird in einem interaktiven Rahmen gerendert. In der mobilen App erscheint die Mermaid-Ausgabe als Codeblock, den du kopieren kannst. Wenn der Modus Daten visualisieren verfügbar ist, erstellt er PNG-Diagramme statt Mermaid-Diagrammen.

​
Wie die Mermaid-Generierung funktioniert

Wenn du ein Diagramm anforderst, analysieren Langdocks KI-Modelle deine Anforderungen und generieren Mermaid-Syntax. Der Prozess ist konversationell und iterativ, sodass du dein Diagramm verfeinern kannst, bis es deiner Vision entspricht.
1

Fordere dein Diagramm an

Beschreibe das Diagramm, das du erstellen möchtest. Sei spezifisch beim Typ (Flussdiagramm, Sequenzdiagramm, etc.) und füge Schlüsselelemente hinzu, die du visualisieren möchtest. Erstelle ein Flussdiagramm, das den Benutzer-Authentifizierungsprozess zeigt
Je spezifischer deine Anfrage, desto besser das erste Ergebnis. Füge Details wie Entscheidungspunkte, Prozessschritte und Beziehungen zwischen Elementen hinzu.
2

KI generiert Mermaid-Code

Das Modell erstellt Mermaid-Syntax basierend auf deiner Beschreibung. Wenn deine Anfrage unklar ist, kann das Modell Folgefragen stellen, um Genauigkeit zu gewährleisten.
Verschiedene Modelle können deine Anfrage leicht unterschiedlich interpretieren – probiere ein anderes Modell, wenn das erste Ergebnis nicht deinen Erwartungen entspricht.
3

Interaktives Diagramm erscheint im Chat

Ein neuer Rahmen mit dem gerenderten Diagramm öffnet sich, sobald die Mermaid-Syntax generiert ist.
Im Chat siehst du dein Diagramm mit Zoom-Steuerungen und Navigationsoptionen.

​
Mit deinem Diagramm interagieren

Der Diagramm-Rahmen im Chat bietet mehrere Interaktionsoptionen, um dir bei der Arbeit mit deiner Visualisierung zu helfen.

​
Icons in der oberen linken Ecke:

  • Hineinzoomen : Vergrößere spezifische Teile deines Diagramms zur detaillierten Untersuchung
  • Herauszoomen : Erhalte eine breitere Ansicht komplexer Diagramme
  • Ansicht zurücksetzen : Kehre zur ursprünglichen Zoomstufe und Position zurück
Verwende Zoom-Steuerungen bei der Arbeit mit großen, komplexen Diagrammen, um dich auf spezifische Abschnitte zu konzentrieren, ohne den Kontext zu verlieren.
  • Klicken und ziehen: Bewege dich in großen Diagrammen, um verschiedene Abschnitte zu untersuchen
  • Responsive Interaktion: Das Diagramm reagiert sofort auf deine Bewegungen

​
Export- und Freigabeoptionen

In der oberen rechten Ecke des Rahmens findest du drei Exportoptionen:

PNG-Download

Lade eine PNG-Datei deines Diagramms herunter, perfekt für Präsentationen, Dokumentationen oder zum Teilen mit Stakeholdern.

Mermaid-Code kopieren

Kopiere die Mermaid-Syntax in deine Zwischenablage zur Verwendung in anderen Tools, Dokumentationssystemen oder Versionskontrolle.

.mermaid-Datei herunterladen

Speichere das Diagramm als .mermaid-Datei zur Bearbeitung in spezialisierten Tools oder zur Integration in Entwicklungs-Workflows.

​
Dein Diagramm verfeinern

Wenn dein Diagramm nicht genau deiner Vision entspricht, kannst du Langdock einfach deine gewünschten Anpassungen im Chat erklären.
  • Farbänderungen: “Färbe die Entscheidungsknoten blau und die Prozessschritte grün”
  • Textanpassungen: “Ändere ‘Benutzer-Login’ zu ‘Authentifizierungsprozess’”
  • Strukturmodifikationen: “Füge einen Schritt für die Passwortvalidierung vor dem Erfolgspfad hinzu”
  • Stil-Updates: “Verwende abgerundete Rechtecke anstatt scharfer Ecken”
  • Layout-Verbesserungen: “Ordne die Knoten vertikal statt horizontal an”
1

Beschreibe deine Änderungen

Sage dem Modell genau, was du ändern möchtest. Sei spezifisch bei Farben, Text, Struktur oder Layout-Änderungen. Ändere die Farbe der Fehlerbehandlungsboxen zu rot und füge eine Wiederholungsschleife hinzu
2

Modell regeneriert Diagramm

Die KI verarbeitet dein Feedback und erstellt aktualisierten Mermaid-Code mit deinen angeforderten Änderungen.
3

Neuer Rahmen zeigt aktualisiertes Diagramm

Im Chat erscheint ein neuer Diagramm-Rahmen mit deinen Modifikationen, bereit für weitere Interaktion oder Export.
Das aktualisierte Diagramm behält alle vorherigen Elemente bei und integriert deine spezifischen Änderungen.
Im Chat erscheint der Diagramm-Rahmen, während die Mermaid-Syntax verarbeitet wird. Wenn das Diagramm nicht gerendert werden kann, erscheint die Meldung Invalid Mermaid syntax. Bitte das Modell, das Diagramm neu zu generieren oder die Mermaid-Syntax zu korrigieren, und versuche es erneut.