Sektordiagram
Et sektordiagram er en sirkulær statistisk graf som deles inn i flere sektorer for å vise numeriske forhold. I et sektordiagram er buelengden til hver sektor proporsjonal med mengden den representerer.
Mermaid kan rendre sektordiagrammer.
Kode
Kopier
Bygg inn
pie title The most popular pets
"Dogs" : 386
"Cats" : 85
"Rats" : 15
Syntaks
Det er svært enkelt å tegne et sektordiagram i Mermaid.
showData angir at den faktiske numeriske verdien rendres etter forklaringsteksten, noe som er valgfritt.
- Deretter følger title -syntaksen og dens strengverdi, som angir tittel for sektordiagrammet, noe som er valgfritt.
- Deretter følger datasettet, og sektorene i sektordiagrammet ordnes med klokken i etikettenes rekkefølge.
label for en del av sektordiagrammet, omsluttet av doble anførselstegn.
Deretter følger et kolon : som skilletegn.
Deretter følger positive numeric value , som angir den konkrete numeriske verdien, med støtte for opptil to desimaler.
mermaid.grammar_pie_data_option_title_value
Eksempel
Kode
Kopier
Bygg inn
---
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
Konfigurasjon
Sektordiagrammet støtter følgende konfigurasjonsparametere:
| Parameter | Beskrivelse | Standardverdi |
|---|---|---|
| textPosition | Den aksiale posisjonen til sektordiagrammets sektoretiketter, fra 0.0 i midten til 1.0 ved sirkelens kant. | 0.75 |
| donutHole | Forholdet til det ringformede hullet. Gyldig verdiområde er 0 til 0.9. | 0.1 |
| legendPosition | Tegnforklaringens plassering i forhold til diagrammet. Gyldige verdier er top , bottom , left , right og center . | top |
| highlightSlice | Uthev en bestemt sektor med samsvarende etikett; sett til hover for å utheve sektoren musepekeren holdes over. | hover |