Skip to main content

Crear diagramas

GitHub Copilot Chat puede ayudarte a crear diagramas para comprender mejor tus datos y comunicar información.

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

Escenario de ejemplo

Quieres crear un diagrama de Gantt para visualizar la escala de tiempo de un proyecto. Puede pedir a Chat de Copiloto en GitHub.com que genere el código Mermaid para el diagrama de Gantt, incluyendo detalles específicos sobre las fases del proyecto y sus duraciones. A continuación, puede usar este código en cualquier archivo de 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 Copiloto 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 Copiloto 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 Mermaid representado.

Información adicional

  •         [Documentación de Mermaid](https://mermaid-js.github.io/mermaid/#/)
    
  •         [Documentación de GitHub Copilot Chat](/copilot/how-tos/use-chat)