Lagkagediagram
Et cirkeldiagram er en cirkulær statistisk graf, der opdeles i flere sektorer for at vise numeriske forhold. I et cirkeldiagram er hver sektors buelængde proportional med den mængde, den repræsenterer.
Mermaid kan rendere cirkeldiagrammer.
Kode
Kopiér
Integrer
pie title The most popular pets
"Dogs" : 386
"Cats" : 85
"Rats" : 15
Syntaks
Det er meget enkelt at tegne et cirkeldiagram i Mermaid.
showData angiver, at de faktiske numeriske værdier rendres efter forklaringsteksten; dette er valgfrit.
- Derefter følger title-syntaksen med dens strengværdi, som angiver titlen på cirkeldiagrammet; dette er valgfrit.
- Derefter følger datasættet, og cirkeldiagrammets sektorer arrangeres med uret i etiketternes rækkefølge.
Etiketten for en del af cirkeldiagrammet, omsluttet af dobbelte anførselstegn.
Derefter følger et kolon : som separator.
Derefter følger en positive numeric value , der angiver den konkrete værdi, med understøttelse af op til to decimaler.
mermaid.grammar_pie_data_option_title_value
Eksempel
Kode
Kopiér
Integrer
---
config:
pie:
textPosition: 0.5
themeVariables:
pieOuterStrokeWidth: "5px"
---
pie showData
title Key elements in Product X
"Calcium" : 42.96
"Potassium" : 50.05
"Magnesium" : 10.01
"Iron" : 5
Konfiguration
Cirkeldiagrammet understøtter følgende konfigurationsparametre:
| Parameter | Beskrivelse | Standardværdi |
|---|---|---|
| textPosition | Cirkeldiagrammets sektoretiketters aksiale placering, fra 0.0 i midten til 1.0 ved cirklens kant. | 0.75 |
| donutHole | Forholdet for det ringformede hul. Det gyldige værdiområde er 0 til 0.9. | 0.1 |
| legendPosition | Forklaringens placering i forhold til diagrammet. Gyldige værdier er top, bottom, left, right og center. | top |
| highlightSlice | Fremhæver bestemte sektorer med matchende etiketter; hvis den sættes til hover, fremhæves den sektor, musen holdes over. | hover |