Visualiseur de Diagramme Ferroviaire de Regex

Génère un diagramme ferroviaire SVG d’une expression régulière montrant les littéraux, groupes, alternatives et répétitions, avec numérotation des groupes de capture et explication des drapeaux

Collez une expression régulière de saveur JavaScript/PCRE et obtenez un diagramme ferroviaire (syntactique) qui rend sa structure évidente — bien plus lisible qu’un mur de métacaractères.

Comment ça marche :

  1. Le pattern est analysé en AST avec la librairie ret.
  2. Chaque nœud d’AST est mappé à une primitive de diagramme ferroviaire : les littéraux deviennent des boîtes arrondies, les groupes sont étiquetés avec leur index de capture (et nom), les alternatives se ramifient en un choix, et les quantifieurs (*, +, ?, {n,m}) se rendent par des flèches de boucle.
  3. Le diagramme est rendu en SVG autonome via railroad-diagrams.

Le rapport liste aussi :

  • Chaque groupe de capture avec son numéro et son nom (le cas échéant).
  • Chaque drapeau avec une explication en clair (g, i, m, s, u, y, d, x).

Lisez le diagramme de gauche à droite. C’est particulièrement utile pour enseigner les regex, documenter des patterns complexes et repérer les formes de retour-arrière catastrophique (quantifieurs imbriqués) avant la production.

Limites : l’analyseur couvre la syntaxe JavaScript/PCRE y compris classes de caractères, ancres, références arrière, groupes nommés, assertions de préanalyse (signalées) et quantifieurs bornés/non bornés. Certaines fonctionnalités PCRE avancées (patterns récursifs, \K, branch reset, conditionnels) ne sont pas prises en charge et renvoient une erreur d’analyse.

Exemples de résultats

2 Exemples

Visualiser un regex d’URL

Un pattern d’URL courant en diagramme ferroviaire avec ancres, groupes et port optionnel.

Railroad diagram with capture groups and flag explanation.
Voir paramètres d'entrée
{ "pattern": "^(https?)://([^/:]+)(:\\d+)?(/.*)?$", "flags": "i" }

Visualiser un pattern de capture d’email

Un groupe de capture d’email simple avec limites de mot en diagramme.

Email pattern railroad diagram with capture group.
Voir paramètres d'entrée
{ "pattern": "\\b(\\w+[\\w.-]*@\\w+[\\w.-]*\\.\\w+)\\b", "flags": "gi" }

Points clés

Catégorie
Développement et Web
Types d’entrée
text
Type de sortie
html
Couverture des échantillons
4
API disponible
Yes

Vue d’ensemble

Ce visualiseur de diagramme ferroviaire de regex convertit vos expressions régulières JavaScript/PCRE en schémas syntaxiques SVG clairs et interactifs. Il décompose visuellement les littéraux, les groupes de capture numérotés, les alternatives et les quantificateurs pour faciliter la compréhension et le débogage de vos patterns complexes.

Quand l’utiliser

  • •Pour documenter ou expliquer une expression régulière complexe dans un projet ou une présentation technique.
  • •Pour déboguer un pattern difficile à lire et identifier visuellement les risques de retour-arrière catastrophique (backtracking).
  • •Pour enseigner le fonctionnement des expressions régulières et des groupes de capture à des développeurs juniors.

Comment ça marche

  • •Saisissez votre expression régulière compatible JavaScript/PCRE et ajoutez éventuellement des drapeaux (flags) comme 'g' ou 'i'.
  • •L'outil analyse le pattern en un arbre de syntaxe abstraite (AST) à l'aide de la bibliothèque 'ret'.
  • •Chaque nœud de l'AST est converti en éléments graphiques SVG (boîtes pour les littéraux, boucles pour les quantificateurs, embranchements pour les alternatives).
  • •Le diagramme ferroviaire final est généré instantanément avec la liste détaillée des groupes de capture et l'explication des drapeaux.

Cas d’usage

Analyse visuelle d'une regex d'extraction d'URL pour vérifier la capture correcte du protocole, du domaine et du port.
Audit de sécurité d'un pattern de validation d'email pour repérer les quantificateurs imbriqués problématiques.
Rédaction de documentation technique illustrée pour expliquer les règles de validation de formulaires.

Exemples

1. Analyse d'une regex de validation d'URL

Développeur Backend
Contexte
Un développeur doit intégrer et documenter une expression régulière complexe servant à valider et décomposer des URL dans une API.
Problème
La regex contient plusieurs groupes optionnels et des classes de caractères imbriquées difficiles à expliquer aux autres membres de l'équipe.
Comment l’utiliser
Saisissez le pattern `^(https?)://([^/:]+)(:\d+)?(/.*)?$` dans le champ d'expression régulière et ajoutez le drapeau `i`.
Configuration d’exemple
pattern: ^(https?)://([^/:]+)(:\d+)?(/.*)?$
flags: i
Résultat
Un diagramme SVG clair montre le cheminement du protocole optionnel, du nom d'hôte, du port et du chemin d'accès, avec la liste des 4 groupes de capture associés.

2. Vérification d'un pattern de capture d'email

Ingénieur QA
Contexte
Un ingénieur QA souhaite s'assurer qu'une expression régulière utilisée pour extraire des adresses email dans des fichiers de logs ne comporte pas d'ambiguïté.
Problème
Le pattern utilise des limites de mots et des répétitions qui doivent être validées visuellement pour éviter les faux positifs.
Comment l’utiliser
Entrez le pattern `\b(\w+[\w.-]*@\w+[\w.-]*\.\w+)\b` avec les drapeaux `gi`.
Configuration d’exemple
pattern: \b(\w+[\w.-]*@\w+[\w.-]*\.\w+)\b
flags: gi
Résultat
Le diagramme ferroviaire met en évidence la structure de la boîte de capture principale entourée par les assertions de limite de mot (\b).

Tester avec des échantillons

image, svg, regex
Modèles d'Expressions Régulières Courants
Modèles d'expressions régulières couramment utilisés pour la validation et la correspondance
title token regex
regex
Alternatives de Modèles Regex
Plusieurs façons d'écrire le même modèle regex avec différents compromis
title token regex
regex
Groupes de Capture Nommés Regex
Collection de modèles regex utilisant des groupes de capture nommés pour extraire des données structurées du texte. Les groupes nommés rendent les modèles plus lisibles et maintenables en assignant des noms significatifs aux parties capturées.
title token regex
regex
Exemples de Remplacement Regex
Collection de modèles de remplacement regex courants et utiles pour la transformation de texte et le nettoyage de données
title token regex
regex

Hubs associés

Outils de conversion de formats d image et d export anime
Comparez les convertisseurs d image pour JPG, PNG, GIF, AVIF, WebP, TIFF, ICO, base64 et les exports orientes animation dans un meme hub.
Outils de nettoyage, finition et preparation d images en lot
Regroupe dans un meme hub les outils de nettoyage d image, rognage, marge, encadrement, redimensionnement et compression par lot, filigrane et finition visuelle.
Outils de test, de linting et de debogage regex
Comparez les testeurs regex, les explicateurs, les linters, les scanners de performance, les generateurs de motifs et les apercus de remplacement dans un meme hub.
Outils de métadonnées image, EXIF et nettoyage de confidentialité
Comparez les visionneuses de métadonnées image, inspecteurs EXIF/IPTC/XMP, correcteurs d’orientation, éditeurs de métadonnées et outils de nettoyage de confidentialité.

FAQ

Quelles syntaxes de regex sont prises en charge ?

L'outil prend en charge la syntaxe JavaScript et PCRE standard, y compris les classes de caractères, les groupes nommés et les assertions.

Le visualiseur prend-il en charge les fonctionnalités PCRE avancées ?

Non, les fonctionnalités avancées comme les patterns récursifs, le reset de branche (\K) ou les conditions ne sont pas supportées.

Comment lire le diagramme ferroviaire généré ?

Le diagramme se lit de gauche à droite en suivant les lignes de connexion à travers les différents blocs et boucles.

Les groupes de capture nommés sont-ils identifiés ?

Oui, l'outil liste et numérote tous les groupes de capture, en affichant leur nom s'ils sont nommés.

Puis-je exporter le diagramme généré ?

Oui, le diagramme est rendu sous forme de fichier SVG autonome que vous pouvez copier ou intégrer.

Documentation de l'API

Point de terminaison de la requête

POST /fr/api/tools/regex-railroad-diagram-visualizer

Paramètres de la requête

Nom du paramètre Type Requis Description
pattern text Oui -
flags text Non -

Format de réponse

{
  "result": "
Processed HTML content
",
  "error": "Error message (optional)",
  "message": "Notification message (optional)",
  "metadata": {
    "key": "value"
  }
}
HTML: HTML

Documentation de MCP

Ajoutez cet outil à votre configuration de serveur MCP: 

{
  "mcpServers": {
    "elysiatools-regex-railroad-diagram-visualizer": {
      "name": "regex-railroad-diagram-visualizer",
      "description": "Génère un diagramme ferroviaire SVG d’une expression régulière montrant les littéraux, groupes, alternatives et répétitions, avec numérotation des groupes de capture et explication des drapeaux",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=regex-railroad-diagram-visualizer",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Vous pouvez chaîner plusieurs outils, par ex.: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, max 20 outils.

Si vous rencontrez des problèmes, veuillez nous contacter à [email protected]