# Visualizador de Diagrama Ferroviário de Regex Renderiza uma expressão regular como diagrama ferroviário SVG mostrando literais, grupos, alternativas e repetição, com numeração de grupos de captura e explicação das flags > Página canônica: https://elysiatools.com/pt/tools/regex-railroad-diagram-visualizer - **Categoria:** Development - **Palavras-chave:** regex, diagrama ferroviário, visualizar, expressão regular ## Visão geral Cole uma expressão regular no estilo JavaScript/PCRE e obtenha um diagrama ferroviário (sintático) que torna a estrutura óbvia — muito mais legível que uma parede de metacaracteres. Como funciona: 1. O padrão é analisado em um AST com a biblioteca `ret`. 2. Cada nó do AST é mapeado para uma primitiva de diagrama ferroviário: literais viram caixas arredondadas, grupos são rotulados com seu índice de captura (e nome), alternativas ramificam em uma escolha, e quantificadores (*, +, ?, {n,m}) são renderizados como setas de retorno. 3. O diagrama é renderizado como um SVG autossuficiente via `railroad-diagrams`. O relatório também lista: - Cada grupo de captura com seu número e nome (se houver). - Cada flag com uma explicação em linguagem clara (g, i, m, s, u, y, d, x). Leia o diagrama da esquerda para a direita. É especialmente útil para ensinar regex, documentar padrões complexos e detectar formas de backtracking catastrófico (quantificadores aninhados) antes da produção. Limitações: o parser cobre a sintaxe JavaScript/PCRE incluindo classes de caracteres, âncoras, retroreferências, grupos nomeados, lookaround (reportado) e quantificadores limitados/ilimitados. Alguns recursos avançados do PCRE (padrões recursivos, \K, branch reset, condicionais) não são suportados e reportam erro de análise. ## Entradas - **Expressão regular** (text): e.g. ^(https?)://(\[^/:\]+)(:\d+)?(/.*)?$ · (\w+@\[\w.-\]+) · \b\d{3}-\d{4}\b - **Flags** (text): e.g. gi · gim · (leave empty for none) ## Quando usar - Ao documentar expressões regulares complexas em projetos de equipe para facilitar a manutenção do código. - Durante o desenvolvimento e depuração de padrões de regex difíceis de ler ou propensos a erros. - Para ensinar ou aprender a sintaxe de expressões regulares visualizando o fluxo de correspondência passo a passo. ## Como funciona - O analisador processa a expressão regular fornecida e a converte em uma Árvore de Sintaxe Abstrata (AST) usando a biblioteca ret. - Cada elemento da AST é mapeado para um componente visual correspondente, como caixas para literais, ramificações para alternativas e loops para quantificadores. - A ferramenta gera um diagrama ferroviário em formato SVG autossuficiente e lista todos os grupos de captura identificados com suas respectivas flags explicadas. ## Casos de uso - Visualização de padrões de validação de e-mail e telefone para auditoria de segurança. - Documentação técnica de rotas de URL e regras de roteamento baseadas em regex. - Identificação visual de quantificadores aninhados que possam causar problemas de backtracking catastrófico. ## Perguntas frequentes ### O que é um diagrama ferroviário de regex? É uma representação visual que mostra o fluxo de correspondência de uma expressão regular da esquerda para a direita, facilitando a leitura de padrões complexos. ### Quais dialetos de regex são suportados? A ferramenta suporta a sintaxe padrão do JavaScript e PCRE, incluindo classes de caracteres, âncoras e grupos de captura. ### A ferramenta suporta recursos avançados como recursão ou branch reset? Não, recursos avançados do PCRE como padrões recursivos, \K e condicionais não são suportados e retornarão erro de análise. ### Como os grupos de captura são exibidos no diagrama? Eles são destacados e rotulados com seus respectivos índices numéricos ou nomes, facilitando a identificação de subpadrões. ### Posso exportar o diagrama gerado? Sim, o diagrama é renderizado como um elemento SVG autossuficiente que pode ser copiado ou salvo diretamente. ## Ferramentas relacionadas - [Folha de Consulta Regex](https://elysiatools.com/pt/tools/regex-cheat-sheet): Uma folha de consulta pesquisável e localizada para a sintaxe de expressões regulares — classes de caracteres, âncoras, quantificadores, grupos e referências, lookaheads, sequências de escape e flags, com um testador rápido integrado - [Depurador de Regex](https://elysiatools.com/pt/tools/regex-debugger): Percorra como uma expressão regular corresponde a uma string posição por posição: visualize tentativas de correspondência, sucessos parciais, backtracks e capturas — uma ferramenta para entender o comportamento do regex, não apenas o resultado final - [Visualização de Substituição Regex](https://elysiatools.com/pt/tools/regex-replace-previewer): Visualização em tempo real de substituições regex com destaques de diferenças e estatísticas - [Calibrador de barra de escala microscópica](https://elysiatools.com/pt/tools/microscope-scale-bar-calibrator): Calcula escala, campo de visão, limites de difração e amostragem de Nyquist, com barra SVG transparente. - [Referência de Tags HTML Auto-Fechantes](https://elysiatools.com/pt/tools/self-closing-html-tags): Guia de referência completo para elementos vazios HTML (tags auto-fechantes), elementos SVG e elementos MathML - [Testador Regex](https://elysiatools.com/pt/tools/regex-tester): Testa expressões regulares contra texto - [Solucionador de Órbita de Kepler](https://elysiatools.com/pt/tools/kepler-orbit-solver): Resolve numericamente a equação de Kepler E − e·sin(E) = M para a anomalia excêntrica E, anomalia verdadeira ν, raio orbital e velocidade relativa, com métodos de Newton/bissecção/ponto fixo, histórico de convergência e diagrama SVG - [Scanner ReDoS para regex](https://elysiatools.com/pt/tools/redos-regex-scanner): Verifica regex quanto a backtracking catastrofico, simula entradas maliciosas e sugere reescritas mais seguras ## Exemplos - [Exemplos de Substituição de Regex](https://elysiatools.com/pt/samples/regex-replace): Coleção de padrões de substituição de regex comuns e úteis para transformação de texto e limpeza de dados - [Padrões Comuns de Expressões Regulares](https://elysiatools.com/pt/samples/regex-samples): Padrões de expressões regulares comumente usados para validação e correspondência - [Alternativas de Padrões Regex](https://elysiatools.com/pt/samples/regex-alternatives): Múltiplas formas de escrever o mesmo padrão regex com diferentes compensações - [Grupos de Captura Nomeados Regex](https://elysiatools.com/pt/samples/regex-named-groups): Coleção de padrões regex usando grupos de captura nomeados para extrair dados estruturados de texto. Grupos nomeados tornam os padrões mais legíveis e mantíveis atribuindo nomes significativos às partes capturadas. ## Conteúdo relacionado - [Ferramentas de teste, visualizacao e depuracao de regex](https://elysiatools.com/pt/hubs/regex-utility): Compare testers de regex, explicadores, guias rapidos, visualizadores, linters, scanners de desempenho e previews de substituicao em um unico hub para desenhar e depurar padroes com mais seguranca. - [Ferramentas de Workflow para SVG, Favicon e Icones](https://elysiatools.com/pt/hubs/svg-favicon-icon-workflows): Gere pacotes de favicon, otimize SVGs, converta icones entre ICO, PNG, JPG, WebP e SVG e prepare assets prontos para web em um unico hub.