Criando diagramas

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

Neste artigo

Chat GitHub Copilot 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 pedir ao Chat Copilot para gerar 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 solicitar ao Chat 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 Mermaid, como problemas, discussões ou pull requests no GitHub.

Solicitação 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.

Exemplo de resposta

Observação

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

O Copilot fornecerá o código Mermaid para criar o fluxograma. Você pode copiar o código que o Chat Copilot fornecer e colá-lo em qualquer lugar no GitHub com suporte para Markdown, como um issue 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

  •         [Mermaid documentation](https://mermaid-js.github.io/mermaid/#/)

  •         [Documentação do GitHub Copilot Chat](/copilot/how-tos/use-chat)