63 lines
1.9 KiB
Markdown
63 lines
1.9 KiB
Markdown
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. Please edit the corresponding file in packages/mermaid/src/docs.
|
|
|
|
# Pie chart diagrams
|
|
|
|
> A pie chart (or a circle chart) is a circular statistical graphic, which is divided into slices to illustrate numerical proportion. In a pie chart, the arc length of each slice (and consequently its central angle and area), is proportional to the quantity it represents. While it is named for its resemblance to a pie which has been sliced, there are variations on the way it can be presented. The earliest known pie chart is generally credited to William Playfair's Statistical Breviary of 1801
|
|
> \-Wikipedia
|
|
|
|
Mermaid can render Pie Chart diagrams.
|
|
|
|
```mermaid-example
|
|
pie title Pets adopted by volunteers
|
|
"Dogs" : 386
|
|
"Cats" : 85
|
|
"Rats" : 15
|
|
```
|
|
|
|
```mermaid
|
|
pie title Pets adopted by volunteers
|
|
"Dogs" : 386
|
|
"Cats" : 85
|
|
"Rats" : 15
|
|
```
|
|
|
|
## Syntax
|
|
|
|
Drawing a pie chart is really simple in mermaid.
|
|
|
|
- Start with `pie` keyword to begin the diagram
|
|
- `showData` to render the actual data values after the legend text. This is **_OPTIONAL_**
|
|
- Followed by `title` keyword and its value in string to give a title to the pie-chart. This is **_OPTIONAL_**
|
|
- Followed by dataSet
|
|
- `label` for a section in the pie diagram within `" "` quotes.
|
|
- Followed by `:` colon as separator
|
|
- Followed by `positive numeric value` (supported upto two decimal places)
|
|
|
|
\[pie] \[showData] (OPTIONAL)
|
|
\[title] \[titlevalue] (OPTIONAL)
|
|
"\[datakey1]" : \[dataValue1]
|
|
"\[datakey2]" : \[dataValue2]
|
|
"\[datakey3]" : \[dataValue3]
|
|
.
|
|
.
|
|
|
|
## Example
|
|
|
|
```mermaid-example
|
|
pie showData
|
|
title Key elements in Product X
|
|
"Calcium" : 42.96
|
|
"Potassium" : 50.05
|
|
"Magnesium" : 10.01
|
|
"Iron" : 5
|
|
```
|
|
|
|
```mermaid
|
|
pie showData
|
|
title Key elements in Product X
|
|
"Calcium" : 42.96
|
|
"Potassium" : 50.05
|
|
"Magnesium" : 10.01
|
|
"Iron" : 5
|
|
```
|