Erstellen von Diagrammen

GitHub Copilot Chat kann dir helfen, Diagramme zu erstellen, um deine Daten besser zu verstehen und Erkenntnisse zu vermitteln.

In diesem Artikel

GitHub Copilot Chat kann dir helfen, Mermaid-Diagramme zum Visualisieren von Daten zu erstellen, sodass du Erkenntnisse leichter verstehen und vermitteln kannst. Du kannst Copilot Chat bitten, Diagramme basierend auf deinen Daten oder deinem Code zu generieren, und es stellt dir den erforderlichen Code bereit, um diese Diagramme zu erstellen.

Beispielszenario

Du möchtest ein Gantt-Diagramm erstellen, um die Zeitachse eines Projekts zu visualisieren. Du kannst Copilot Chat bitten, den Mermaid-Code für das Gantt-Diagramm mit spezifischen Details zu den Projektphasen und deren Dauer zu generieren. Du kannst diesen Code dann in jeder Markdowndatei verwenden, die Mermaid-Syntax unterstützt, z. B. Probleme, Diskussionen oder Pull Requests für GitHub.

Beispiel für Prompt

Copilot Chat 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.

Beispielantwort

Hinweis

Die folgende Antwort ist ein Beispiel. Da die Copilot Chat-Antworten nicht deterministisch sind, erhältst du möglicherweise eine andere Antwort als die hier beschriebene.

Copilot stellt dir den Mermaid-Code zum Erstellen des Flussdiagramms bereit. Du kannst den Code Copilot Chat kopieren, und ihn an einer beliebigen Stelle auf GitHub einfügen, die Markdown unterstützt, z. B. ein Problem oder eine Diskussion.

Stelle sicher, dass du die richtige Mermaid-Syntax von ```mermaid und ``` nach dem Codeblock einfügst, um das Diagramm ordnungsgemäß zu rendern.

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

Dieser Mermaid-Code würde das folgende Diagramm generieren:

Screenshot eines gerenderten Mermaid-Gantt-Diagramms

Weitere Informationen