Mermaid permite criar diagramas e visualizações usando texto e código.
É uma ferramenta de diagramação e gráficos baseada em JavaScript que renderiza definições de texto inspiradas em Markdown para criar e modificar diagramas dinamicamente.
Utilização
Para criar diagramas com Mermaid basta criar um arquivo de extensão .md(Markdown) e criar um bloco de código onde será inserida a sintaxe para seus diagramas, exemplo:
```mermaid ```
Note que precisa definir a sintaxe para
mermaid.
Exemplo básico, um fluxograma entre: A, B, C e D:
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```
A saída será:
Suporte nativo para o Mermaid
O GitHub possui suporte nativo para o Mermaid. Isso significa que se você criar uma sintaxe Mermaid no seu README.md de algum repositório, será renderizado automaticamente, incluindo controle para manipular os diagramas, exemplo:
# Recursos
- FastAPI
- Banco de Dados
```mermaid
graph LR;
A["API (FastAPI) fa:fa-globe"]
B[("Banco de Dados (PG) fa:fa-cubes")]
A --> B
```
Será renderizado como:
Note os controles, se quiser ver renderizado clique aqui.
Para mais informações e detalhes acesse: https://mermaid.js.org/
