Criando diagramas

GitHub Copilot Chat pode ajudá-lo a criar diagramas para entender melhor seus dados e comunicar insights.

Neste artigo

Copilot Chat do GitHub em GitHub.com pode ajudá-lo a criar diagramas Mermaid para visualizar dados, facilitando a compreensão e a comunicação de insights. Você pode solicitar Bate-papo do Copilot a geração de diagramas com base em seus dados ou código e ele fornecerá o código necessário para criar esses diagramas.

Cenário de exemplo

Você deseja criar um gráfico de Gantt para visualizar a linha do tempo de um project. Você pode pedir ao Bate-papo do Copilot no GitHub.com para gerar o código Mermaid para o gráfico de Gantt, com detalhes específicos sobre as fases do projeto e suas durações. Em seguida, você pode usar esse código em qualquer arquivo Markdown que dê suporte à sintaxe de Sereia, como problemas, discussões ou solicitações de pull.GitHub

Prompt de exemplo

Copilot prompt
Create a Mermaid Gantt diagram that covers the period August 1st 2025 until January 31st, 2025. Include 5 phases, each taking 6 weeks, and overlapping equally.

Resposta de exemplo

Observação

A resposta a seguir é um exemplo. Respostas do Bate-papo do Copilot são não determinísticas, portanto, você pode obter uma resposta diferente da mostrada aqui.

Copilot fornecerá o código Mermaid para criar o fluxograma. Você pode copiar o código Bate-papo do Copilot que fornece e colá-lo em qualquer lugar que GitHub dê suporte ao Markdown, como um problema ou uma discussão.

Certifique-se de incluir a sintaxe correta do Mermaid ```mermaid antes e ``` depois do bloco de código para renderizar o diagrama corretamente.

```mermaid
gantt
    title Project Timeline: Aug 2025 - Jan 2026
    dateFormat  YYYY-MM-DD
    axisFormat  %b %d

    section Phase 1
    Phase 1           :a1, 2025-08-01, 42d

    section Phase 2
    Phase 2           :a2, 2025-09-07, 42d

    section Phase 3
    Phase 3           :a3, 2025-10-13, 42d

    section Phase 4
    Phase 4           :a4, 2025-11-18, 42d

    section Phase 5
    Phase 5           :a5, 2025-12-24, 42d
```

Esse código mermaid geraria o seguinte diagrama:

Captura de tela de um gráfico de Gantt renderizado do Mermaid.

Leitura adicional