Koláčový graf
Koláčový graf je kruhový statistický graf, který se dělí na několik výsečí pro zobrazení číselných poměrů. V koláčovém grafu je délka oblouku každé výseče úměrná množství, které představuje.
Mermaid umí vykreslit koláčový graf.
Kód
Kopírovat
Vložení
pie title The most popular pets
"Dogs" : 386
"Cats" : 85
"Rats" : 15
Syntaxe
Vykreslení koláčového grafu v Mermaid je velmi jednoduché.
showData znamená vykreslení skutečných hodnot za textem legendy, což je volitelné.
- Následuje syntaxe title a její řetězcová hodnota, která nastavuje název koláčového grafu, což je volitelné.
- Dále následuje datová sada; výseče koláčového grafu budou uspořádány ve směru hodinových ručiček v pořadí popisků.
label jedné části koláčového grafu uzavřený do dvojitých uvozovek.
Následuje dvojtečka : jako oddělovač.
Za ní následuje positive numeric value představující konkrétní hodnotu, podporovány jsou maximálně dvě desetinná místa.
mermaid.grammar_pie_data_option_title_value
Příklad
Kód
Kopírovat
Vložení
---
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
Konfigurace
Koláčový graf podporuje následující konfigurační parametry:
| Parametr | Popis | Výchozí hodnota |
|---|---|---|
| textPosition | Axiální pozice popisků výsečí koláčového grafu, od 0.0 ve středu do 1.0 na okraji kruhu. | 0.75 |
| donutHole | Poměr kruhového otvoru. Rozsah platných hodnot je 0 až 0.9. | 0.1 |
| legendPosition | Pozice legendy vzhledem k diagramu. Platné hodnoty jsou top, bottom, left, right a center. | top |
| highlightSlice | Zvýrazní určitou výseč s odpovídajícím popiskem; nastavení na hover zvýrazní výseč, na kterou se najede myší. | hover |