Elysia Tools

Durchsuche Tools, Beispiele, visuelle Erklärungen und Themenguides an einem klaren Ort.

Beliebte Kategorien

Themen

Sprache
ZHESPTRUFRDEEN

Elysia Tools

Mobile Navigation

Development

Regex-Eisenbahndiagramm-Visualisierer

· Zuletzt aktualisiert:2026-06-20

Rendert einen regulären Ausdruck als SVG-Eisenbahndiagramm (Syntaxbaum), das Literale, Gruppen, Alternativen und Wiederholungen zeigt, mit Nummerierung der Capture-Gruppen und Flag-Erklärungen

Einzelheiten

Wobei dieses Tool hilft

Füge einen regulären Ausdruck im JavaScript/PCRE-Stil ein und erhält ein Eisenbahndiagramm (Syntaxbaum), das die Struktur offensichtlich macht — viel leichter lesbar als eine Wand von Metazeichen.

Funktionsweise:

  1. Das Pattern wird mit der Bibliothek ret in einen AST zerlegt.
  2. Jeder AST-Knoten wird auf eine Eisenbahndiagramm-Primitive abgebildet: Literale werden abgerundete Boxen, Gruppen werden mit ihrem Capture-Index (und Name) beschriftet, Alternativen verzweigen in eine Auswahl, und Quantoren (*, +, ?, {n,m}) werden als Rückführungspfeile gerendert.
  3. Das Diagramm wird als in sich geschlossenes SVG via railroad-diagrams gerendert.

Der Bericht listet zudem:

  • Jede Capture-Gruppe mit Nummer und Name (falls vorhanden).
  • Jedes Flag mit einer Erklärung in Klartext (g, i, m, s, u, y, d, x).

Lies das Diagramm von links nach rechts. Besonders nützlich zum Lehren von Regex, zum Dokumentieren komplexer Patterns und zum Erkennen katastrophaler Rückverfolgung (verschachtelte Quantoren) vor dem Produktivbetrieb.

Einschränkungen: Der Parser deckt JavaScript/PCRE-Syntax einschließlich Zeichenklassen, Anker, Rückreferenzen, benannten Gruppen, Lookaround (gemeldet) und beschränkte/unbeschränkte Quantoren ab. Einige erweiterte PCRE-Funktionen (rekursive Patterns, \K, Branch-Reset, Conditional) werden nicht unterstützt und geben einen Parse-Fehler.

Ausführung

Dieses Tool ausführen

Fülle das Formular aus, starte das Tool und prüfe das Ergebnis an einem Ort.

Beispiele

Beispiele zu diesem Tool

Verwandt

Mit verwandten Tools und Themen fortfahren

Verfasst vom Elysia Tools Team
Bild355
Visualisierung69
Regex24
SVG14
Reguläre Ausdrücke8

Leitfaden zur Tool-Nutzung

Erfahren Sie, wann dieses Tool passt, was es unterstützt und wie Nutzer es anwenden.

Wichtige Fakten

Kategorie
Development
Eingabetypen
text
Ausgabetyp
html
Sample-Abdeckung
4
API bereit
Ja

Überblick

Der Regex-Eisenbahndiagramm-Visualisierer übersetzt komplexe reguläre Ausdrücke im JavaScript- und PCRE-Stil in übersichtliche, grafische SVG-Syntaxdiagramme. Durch die visuelle Darstellung von Literalen, Capture-Gruppen, Alternativen und Quantoren wird die Funktionsweise von Suchmustern sofort verständlich und lässt sich einfacher analysieren sowie dokumentieren.

Wann verwenden

  • Zur verständlichen Dokumentation komplexer regulärer Ausdrücke in technischen Spezifikationen oder Team-Wikis.
  • Zur Fehlersuche und Analyse verschachtelter Regex-Muster, um logische Fehler oder Performance-Probleme frühzeitig zu erkennen.
  • Für Schulungszwecke und Code-Reviews, um die genaue Funktionsweise von Suchmustern visuell zu vermitteln.

So funktioniert es

  1. 1Geben Sie Ihren regulären Ausdruck im Eingabefeld ein und fügen Sie optional die gewünschten Flags (wie g, i oder m) hinzu.
  2. 2Der Parser zerlegt das Pattern mithilfe der ret-Bibliothek in einen abstrakten Syntaxbaum (AST).
  3. 3Jeder AST-Knoten wird in ein passendes Diagramm-Element übersetzt, wobei Literale als Boxen, Alternativen als Verzweigungen und Quantoren als Schleifen dargestellt werden.
  4. 4Das Tool generiert ein interaktives SVG-Diagramm und listet alle erkannten Capture-Gruppen sowie Flag-Erklärungen übersichtlich auf.

Anwendungsfälle

  • Visualisierung eines komplexen URL-Parsers zur Überprüfung aller optionalen Pfade und Port-Angaben.
  • Analyse von E-Mail-Validierungsmustern zur Identifizierung von redundanten Zeichenklassen oder fehlerhaften Wortgrenzen.
  • Erstellung von verständlichen Grafiken für Entwickler-Dokumentationen, um reguläre Ausdrücke ohne mühsames Entziffern von Metazeichen zu erklären.

Beispiele

1. Visualisierung eines URL-Parsers

Backend-Entwickler

Hintergrund

Ein Entwickler muss eine Regex zur Validierung von URLs in einer API-Dokumentation verständlich erklären.

Aufgabe

Die Regex ^(https?)://([^/:]+)(:\d+)?(/.*)?$ ist für andere Teammitglieder schwer lesbar.

Verwendung

Geben Sie das URL-Pattern in das Eingabefeld ein und setzen Sie das Flag i für Case-Insensitivity.

pattern: ^(https?)://([^/:]+)(:\d+)?(/.*)?$, flags: i

Ergebnis

Es wird ein SVG-Diagramm erzeugt, das die Protokoll-Auswahl, die Host-Gruppe, den optionalen Port und den Pfad als klare, verzweigte Pfade darstellt.

2. Analyse eines E-Mail-Erkennungsmusters

QA-Ingenieur

Hintergrund

Ein Tester möchte sicherstellen, dass ein regulärer Ausdruck für E-Mail-Adressen Wortgrenzen korrekt berücksichtigt.

Aufgabe

Prüfung der genauen Funktionsweise von Wortgrenzen und Capture-Gruppen im Pattern \b(\w+[\w.-]*@\w+[\w.-]*\.\w+)\b.

Verwendung

Tragen Sie das E-Mail-Pattern ein und aktivieren Sie die Flags gi.

FAQ

Welche Regex-Dialekte werden unterstützt?

Das Tool unterstützt JavaScript- und PCRE-kompatible reguläre Ausdrücke, einschließlich Capture-Gruppen, Lookarounds und Quantoren.

Können komplexe PCRE-Features wie rekursive Muster visualisiert werden?

Nein, erweiterte Features wie rekursive Patterns, \K oder Branch-Resets werden nicht unterstützt und führen zu einem Parse-Fehler.

Wie lese ich das generierte Eisenbahndiagramm?

Das Diagramm wird von links nach rechts gelesen. Verzweigungen stellen Alternativen dar, während Schleifen Wiederholungen (Quantoren) symbolisieren.

Werden benannte Capture-Gruppen im Diagramm angezeigt?

Ja, das Tool nummeriert alle Capture-Gruppen und zeigt auch die Namen von benannten Gruppen direkt im Diagramm und im Bericht an.

In welchem Format wird das Diagramm ausgegeben?

Das Diagramm wird als direkt im Browser gerendertes, hochauflösendes SVG-Bild ausgegeben.

Thema

Regex-Test-, Visualisierungs- und Sicherheitsworkflow

Erstelle zuverlaessige regulaere Ausdruecke mit Syntaxhilfe, Tests, Visualisierung, Ersetzungsvorschau, Benchmarks und ReDoS-Scan.

Start
Werkzeuge3201
Beispiele593
Visualisierungen465
Dateibetrachter103
Themen233
Schlagwörter333
Bilder, Audio & Video657

Werkzeuge für Bild-, Audio- und Videobearbeitung, Konvertierung und Optimierung

Mathe, Datum & Finanzen644

Rechner, Zahlenwerkzeuge, Datumslogik, Statistik und Finanztools

Design & Farbe297

Werkzeuge für Farben, Layouts, Grafiken, visuelle Gestaltung und Designhilfen

Text & Schreiben209

Werkzeuge für Schreiben, Bereinigung, Formatierung, Extraktion und Textanalyse

Entwicklung & Web193

Entwicklerwerkzeuge, Netzwerk-Utilities, Web-Debugging und Automatisierungshelfer

Konvertierung & Kodierung175

Werkzeuge für Format-, Datei-, Archiv-, Einheiten- und Kodierungskonvertierung

FLAC/WAV-Quellen prüfen und Nachweise übergeben
Selbst gehostetes Gewinnspiel-Widget prüfen und zur Einbettung übergeben
Stripe-Codepaket prüfen und lokalen Import vorbereiten
Technische Fotoauswahl prüfen und Kandidaten zur Bearbeitung übergeben
UI-Screenshot strukturieren, prüfen und an die Entwicklung übergeben

© 2026 Elysia Tools. Alle Rechte vorbehalten.

DokumentationTarifeÜber unsNutzungsbedingungenDatenschutzerklärungCookiesKontakt
Textverarbeitung

Regex-Ersetzungsbeispiele

Sammlung häufiger und nützlicher Regex-Ersetzungsmuster für Texttransformation und Datenbereinigung

Entwicklung

Häufige Reguläre Ausdrücke

Häufig verwendete reguläre Ausdrucksmuster für Validierung und Übereinstimmung

Validierung

Regex-Muster Alternativen

Mehrere Möglichkeiten, dasselbe Regex-Muster zu schreiben mit unterschiedlichen Kompromissen

Textverarbeitung

Benannte Capture-Gruppen von Regex

Sammlung von Regex-Mustern, die benannte Capture-Gruppen verwenden, um strukturierte Daten aus Text zu extrahieren. Benannte Gruppen machen Muster lesbarer und wartbarer, indem sie aussagekräftige Namen den erfassten Teilen zuweisen.

Math & Numbers

Normalverteilungs-Plotter

Zeichnet eine Normalverteilungskurve als SVG mit z-Markern, Intervall-/Schwanz-Schattierung und σ-Bändern 68/95/99.7.

Development

PCRE2 Regex-Tester

Teste PCRE2-Muster online: sämtliche benannte Gruppen-Syntax ((?P<n>), (?<n>), (?'n')), possessive Quantoren, atomare Gruppen, \A \z \h — plus pcre2grep und C-API.

Development

Regex-Spickzettel

Ein durchsuchbarer, lokalisierter Spickzettel für die Syntax regulärer Ausdrücke — Zeichenklassen, Anker, Quantoren, Gruppen und Referenzen, Lookarounds, Escape-Sequenzen und Flags, mit integriertem Schnelltester

Sports

Team-Leistungsvergleich

Fügen Sie Saisonstatistiken mehrerer Teams als CSV ein und erhalten Sie eine Vergleichstabelle mit Bestes/Schlechtestes pro Spalte, normalisierten 0–100-Scores, Composite-Ranking und SVG-Balkendiagrammen.

pattern: \b(\w+[\w.-]*@\w+[\w.-]*\.\w+)\b, flags: gi

Ergebnis

Das Diagramm zeigt die Wortgrenzen-Anker am Anfang und Ende sowie die innere Capture-Gruppe für die E-Mail-Struktur.