원형 차트
원형 차트는 여러 부채꼴로 나누어 수치 비율을 표시하는 원형 통계 그래픽입니다. 원형 차트에서 각 부채꼴의 호 길이는 나타내는 수량에 비례합니다.
Mermaid 는 원형 차트를 렌더링할 수 있습니다.
코드
복사
임베드
pie title The most popular pets
"Dogs" : 386
"Cats" : 85
"Rats" : 15
문법
Mermaid 에서 원형 차트를 그리는 것은 매우 간단합니다.
showData 는 범례 텍스트 뒤에 실제 수치를 렌더링하는 것을 나타내며, 이는 선택 사항입니다.
- 뒤에 title 문법과 그 문자열 값이 오며, 원형 차트의 제목을 설정하며 이는 선택 사항입니다.
- 다음은 데이터 집합이며, 원형 차트의 부채꼴은 레이블 순서대로 시계 방향으로 배열됩니다.
원형 차트의 한 부분에 대한 label 로, 큰따옴표로 감쌉니다.
뒤에 콜론 : 이 구분 기호로 옵니다.
뒤에 positive numeric value 가 오며 구체적인 수치를 나타내고 최대 소수점 두 자리를 지원합니다.
mermaid.grammar_pie_data_option_title_value
예시
코드
복사
임베드
---
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
구성
원형 차트는 다음 구성 매개변수를 지원합니다:
| 매개변수 | 설명 | 기본값 |
|---|---|---|
| textPosition | 원형 차트 부채꼴 레이블의 축 위치로, 중심의 0.0 에서 원 가장자리의 1.0 까지입니다. | 0.75 |
| donutHole | 고리 구멍 비율. 유효한 값 범위는 0 에서 0.9 입니다. | 0.1 |
| legendPosition | 차트에 대한 범례의 위치. 유효한 값은 top, bottom, left, right 및 center 입니다. | top |
| highlightSlice | 일치하는 레이블이 있는 특정 부채꼴을 강조 표시하며, hover 로 설정하면 마우스를 올린 부채꼴이 강조 표시됩니다. | hover |
