Crear diagramas

GitHub Chat de Copilot puede ayudarle a crear diagramas para comprender mejor los datos y comunicar información.

En este artículo

Chat de GitHub Copilot en GitHub.com puede ayudarle a crear diagramas Mermaid para visualizar datos, lo que facilita la comprensión y la comunicación de la información. Puedes pedirle a chat de Copilot que genere diagramas basados en datos o código, y te proporcionará el código necesario para crear esos diagramas.

Escenario de ejemplo

Quiere crear un gráfico de Gantt para visualizar el cronograma de un proyecto. Puede solicitar a chat de Copilot en GitHub.com que genere el código Mermaid para el diagrama de Gantt, con detalles específicos sobre las fases del proyecto y su duración. A continuación, puede usar este código en cualquier archivo Markdown que admita la sintaxis de Mermaid, como problemas, discusiones o solicitudes de incorporación de cambios en GitHub.

Ejemplos de indicaciones

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.

Respuesta de ejemplo

Nota:

La respuesta siguiente es un ejemplo. Las respuestas de chat de Copilot no son deterministas, por lo que puedes obtener una respuesta diferente a la aquí mostrada.

Copilot le proporcionará el código Mermaid para crear el diagrama de flujo. Puedes copiar el código que proporciona chat de Copilot y pegarlo en cualquier lugar de GitHub que admita Markdown, como una incidencia o un debate.

Asegúrese de incluir la sintaxis correcta de Mermaid con ```mermaid antes y ``` después del bloque de código para representar el diagrama correctamente.

```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
```

Este código Mermaid generaría el siguiente diagrama:

Captura de pantalla de un diagrama de Gantt de Mermaid representado.

Información adicional

  • documentación de Mermaid
  •         [Documentación de GitHub Copilot Chat](/copilot/how-tos/use-chat)