MDPress

Mermaid zu PDF

Mermaid Diagramm als PDF, mit dem Markdown drumherum

Schreibe dein Flussdiagramm, Sequenzdiagramm oder Gantt-Diagramm in einem mermaid-Codeblock, und MDPress zeichnet es. Das Diagramm erscheint in der Live-Vorschau und landet im PDF als Vektorgrafik, sodass Linien bei jedem Zoom scharf bleiben. Keine Installation, keine Kommandozeile und kein Konto für deine ersten vier PDFs am Tag.

Konverter öffnen

Vom mermaid-Block zum PDF in drei Schritten

  1. 01

    Füge dein Markdown ein

    Füge das Dokument in den Editor ein oder lade eine .md-Datei hoch. Halte jedes Diagramm in einem eingezäunten Codeblock, der mit drei Backticks und dem Wort mermaid beginnt, genau wie GitHub es erwartet.

  2. 02

    Prüfe das Diagramm in der Vorschau

    Die Vorschau zeichnet jedes Diagramm während du tippst. Enthält die Syntax einen Fehler, zeigt der Block stattdessen reinen Code, sodass du die fehlerhafte Zeile findest und korrigierst, bevor du exportierst.

  3. 03

    Wähle einen Stil und lade herunter

    Wähle Klar, Redaktionell oder Technisch, dann A4, A5 oder US Letter. Drücke den PDF-Button, und die Datei lädt herunter mit eingebetteten Diagrammen und auswählbarem Text drumherum.

Eine Markdown-Datei mit einem Mermaid-Flussdiagramm

Diese kurze Prozessnotiz enthält ein Flussdiagramm zwischen zwei Abschnitten aus gewöhnlichem Markdown.

# Release-Prozess

Jede Änderung folgt demselben Weg vom Review bis zur Produktion.

```mermaid
flowchart LR
  A[Pull Request öffnen] --> B[Code-Review]
  B --> C[Tests ausführen]
  C --> D[Auf Staging bereitstellen]
  D --> E[Release]
```

## Notizen

- Reviews brauchen eine Freigabe.
- Tests laufen bei jedem Push.
- Staging nutzt dieselben Einstellungen wie die Produktion.

Release-Prozess

Jede Änderung folgt demselben Weg vom Review bis zur Produktion.

flowchart LR
  A[Pull Request öffnen] --> B[Code-Review]
  B --> C[Tests ausführen]
  C --> D[Auf Staging bereitstellen]
  D --> E[Release]

Notizen

  • Reviews brauchen eine Freigabe.
  • Tests laufen bei jedem Push.
  • Staging nutzt dieselben Einstellungen wie die Produktion.

Warum Mermaid-Diagramme hier umwandeln

Vektor, kein Screenshot

Jedes Diagramm gelangt als Vektorgrafik ins PDF statt als Bitmap. Zoome in ein dichtes Flussdiagramm oder drucke es auf Papier, und Linien sowie Beschriftungen bleiben scharf.

Diagramm und Dokument zusammen

Die meisten Mermaid-Werkzeuge exportieren nur ein Bild. Hier sitzt das Diagramm im gesamten Dokument, neben deinen Überschriften, Tabellen und hervorgehobenem Code, sodass eine Spezifikation oder Design-Notiz als eine Datei geliefert wird.

Diagramme bleiben zusammenhängend

Ein Diagramm wird auf die Seitenbreite verkleinert, und das Layout vermeidet eine Aufteilung über zwei Seiten. Landet eines ungünstig, setze eine \newpage-Zeile darüber, um eine neue Seite zu beginnen.

Tipps für saubere Diagramme

  • Halte Knotenbeschriftungen kurz und schlicht. Lange Beschriftungen ergeben ein breites Diagramm, und ein breites Diagramm wird auf die Seite verkleinert, was seinen Text schrumpfen lässt.
  • Große Diagramme wirken auf A4 oder US Letter besser als auf A5. Für eine lange Schrittkette probiere ein Flussdiagramm von oben nach unten, damit es die Höhe der Seite nutzt.
  • Zeigt ein Block in der Vorschau als Code, hat die Mermaid-Syntax einen Fehler. Das PDF zeigt denselben Codeblock, also korrigiere ihn vor dem Herunterladen.

Fragen zu Mermaid als PDF

Wie wandle ich ein Mermaid-Diagramm in ein PDF um?
Setze das Diagramm in einen eingezäunten Codeblock mit der Markierung mermaid, füge ihn in MDPress ein und drücke den PDF-Button. Das Diagramm kann das ganze Dokument sein oder ein Teil einer längeren Markdown-Datei. Beides funktioniert gleich.
Welche Mermaid-Diagrammtypen werden unterstützt?
MDPress führt die Standard-Mermaid-Bibliothek in deinem Browser aus, sodass Flussdiagramme, Sequenzdiagramme, Klassendiagramme, Zustandsdiagramme, Gantt-Diagramme und die anderen eingebauten Typen gezeichnet werden. Erscheint ein Diagramm in der Vorschau, ist es auch im PDF.
Ist es kostenlos, und wird mein Diagramm gespeichert?
Du bekommst vier kostenlose PDFs alle 24 Stunden ohne Konto und fünf mit einem kostenlosen Konto. Dein Text wird einmal an den Server gesendet, um das PDF zu erstellen, und wird nicht aufbewahrt. Der Entwurf selbst bleibt in deinem Browser.

Verwandle dein Mermaid-Markdown in ein PDF

Füge ein Dokument mit einem mermaid-Block ein und sieh, wie das Diagramm in der Vorschau erscheint.

Konverter öffnen