Donut-Chart¶

Generisches Ringdiagramm zur Visualisierung von Verteilungen. Wird für Geschlechterverteilung, Teilnahmequoten, Sprachverteilung und Kompetenzstandards eingesetzt.

Screenshot¶

Donut-Charts in der Übersicht

API-Bezug¶

Der Donut-Chart ist generisch und wird mit verschiedenen API-Datenquellen verwendet. Typische Quellen:

Geschlecht / Sprache / SES: Aus Kovariaten der /competence-levels?type=students-Response oder aus /aggregations-Aggregationen
Teilnahme: Aus participation-Aggregationen
Kompetenzstandards: Berechnet aus Kompetenzstufen-Verteilungen

Konfiguration¶

Input	Typ	Default	Beschreibung
`data`	`DonutChartData[]`	Beispieldaten	Segmente mit Name, Wert und Farbe
`showLegend`	`boolean`	`true`	Legende anzeigen
`centerLabel`	`string` oder `null`	`null`	Text in der Mitte (`null` = Gesamtzahl)
`size`	`'default'` oder `'small'`	`'default'`	Diagrammgröße
`title`	`string`	`''`	Titel für Barrierefreiheit

Jedes Segment benötigt:

name -- Bezeichnung (z.B. "weiblich")
value -- absolute Häufigkeit
color -- Hex-Farbcode (z.B. "#9b59b6")

Übernahme¶

Komponente: DonutChartComponent (Selektor: app-donut-chart)

<!-- Geschlechterverteilung -->
<app-donut-chart [data]="genderData" title="Geschlecht" />

<!-- Prozentwert (klein) -->
<app-donut-chart [data]="participationData" centerLabel="85%" size="small" [showLegend]="false" />