편집 요약 없음 |
편집 요약 없음 |
||
27번째 줄: | 27번째 줄: | ||
-->{{{3번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}%, <!-- | -->{{{3번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}%, <!-- | ||
-->{{{4번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}%, <!-- | -->{{{4번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}%, <!-- | ||
-->{{{5번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}}}%);}}|}}"></div></div></includeonly></onlyinclude> | -->{{{5번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}}}%);}}|}}<!-- | ||
수치가 6개일 때 | |||
-->{{#if:{{{6번 색|}}}|{{#if:{{{7번 색|}}}||conic-gradient(<!-- | |||
-->{{{1번 색|}}} 0% {{{1번 수치|}}}%, <!-- | |||
-->{{{2번 색|}}} {{{1번 수치|}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}}}%, <!-- | |||
-->{{{3번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}%, <!-- | |||
-->{{{4번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}%, <!-- | |||
-->{{{5번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}}}%, <!-- | |||
-->{{{6번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}}}%);}}|}}<!-- | |||
수치가 7개일 때 | |||
-->{{#if:{{{7번 색|}}}|{{#if:{{{8번 색|}}}||conic-gradient(<!-- | |||
-->{{{1번 색|}}} 0% {{{1번 수치|}}}%, <!-- | |||
-->{{{2번 색|}}} {{{1번 수치|}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}}}%, <!-- | |||
-->{{{3번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}%, <!-- | |||
-->{{{4번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}%, <!-- | |||
-->{{{5번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}}}%, <!-- | |||
-->{{{6번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}}}%, <!-- | |||
-->{{{7번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}}}%);}}|}}<!-- | |||
수치가 8개일 때 | |||
-->{{#if:{{{8번 색|}}}|{{#if:{{{9번 색|}}}||conic-gradient(<!-- | |||
-->{{{1번 색|}}} 0% {{{1번 수치|}}}%, <!-- | |||
-->{{{2번 색|}}} {{{1번 수치|}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}}}%, <!-- | |||
-->{{{3번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}%, <!-- | |||
-->{{{4번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}%, <!-- | |||
-->{{{5번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}}}%, <!-- | |||
-->{{{6번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}}}%, <!-- | |||
-->{{{7번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}}}%, <!-- | |||
-->{{{8번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}+{{{8번 수치|}}}}}%);}}|}}<!-- | |||
수치가 9개일 때 | |||
-->{{#if:{{{9번 색|}}}|{{#if:{{{10번 색|}}}||conic-gradient(<!-- | |||
-->{{{1번 색|}}} 0% {{{1번 수치|}}}%, <!-- | |||
-->{{{2번 색|}}} {{{1번 수치|}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}}}%, <!-- | |||
-->{{{3번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}%, <!-- | |||
-->{{{4번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}%, <!-- | |||
-->{{{5번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}}}%, <!-- | |||
-->{{{6번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}}}%, <!-- | |||
-->{{{7번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}}}%, <!-- | |||
-->{{{8번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}+{{{8번 수치|}}}}}%, <!-- | |||
-->{{{9번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}+{{{8번 수치|}}}}}% {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}+{{{8번 수치|}}}+{{{9번 수치|}}}}}%);}}|}}<!-- | |||
수치가 10개일 때 | |||
-->{{#if:{{{10번 색|}}}|{{#if:{{{11번 색|}}}||conic-gradient(<!-- | |||
-->{{{1번 색|}}} 0% {{{1번 수치|}}}%, <!-- | |||
-->{{{2번 색|}}} {{{1번 수치|}}}% <!-- | |||
-->{{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}}}%, <!-- | |||
-->{{{3번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}}}% <!-- | |||
-->{{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}%, <!-- | |||
-->{{{4번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}}}% <!-- | |||
-->{{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}%, <!-- | |||
-->{{{5번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}}}% <!-- | |||
-->{{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}}}%, <!-- | |||
-->{{{6번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}}}% <!-- | |||
-->{{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}}}%, <!-- | |||
-->{{{7번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}}}% <!-- | |||
-->{{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}}}%, <!-- | |||
-->{{{8번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}}}% <!-- | |||
-->{{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}+{{{8번 수치|}}}}}%, <!-- | |||
-->{{{9번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}+{{{8번 수치|}}}}}% <!-- | |||
-->{{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}+{{{8번 수치|}}}+{{{9번 수치|}}}}}%, <!-- | |||
-->{{{10번 색|}}} {{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}+{{{8번 수치|}}}+{{{9번 수치|}}}}}% <!-- | |||
-->{{#expr:{{{1번 수치|}}}+{{{2번 수치|}}}+{{{3번 수치|}}}+{{{4번 수치|}}}+{{{5번 수치|}}}+{{{6번 수치|}}}+{{{7번 수치|}}}+{{{8번 수치|}}}+{{{9번 수치|}}}+{{{10번 수치|}}}}}%);}}|}}"></div></div></includeonly></onlyinclude> | |||
{{목차제거}} | {{목차제거}} | ||
== 설명 == | == 설명 == | ||
41번째 줄: | 115번째 줄: | ||
}}</pre> | }}</pre> | ||
* '''현재는 | * '''현재는 10개, 즉 10번 색과 수치까지만 입력할 수 있습니다.''' | ||
* '''모든 수치의 합은 반드시 100'''이 되어야 하며 '''단위 없이 숫자만''' 입력하면 됩니다. | * '''모든 수치의 합은 반드시 100'''이 되어야 하며 '''단위 없이 숫자만''' 입력하면 됩니다. | ||
* 크기 변수는 선택이며 px 단위로 너비와 높이를 조정할 수 있습니다. 기본값은 200px입니다. %로도 입력할 수 있으나 권장하지 않습니다. | * 크기 변수는 선택이며 px 단위로 너비와 높이를 조정할 수 있습니다. 기본값은 200px입니다. %로도 입력할 수 있으나 권장하지 않습니다. |
2023년 4월 21일 (금) 18:07 판
틀:원형 그래프 | |
---|---|
사용문서
|
|
넘겨주기
|
이동하기
|
설명
HTML의 conic-gradient를 이용해 원형 그래프를 생성하는 틀입니다.
사용법
{{원형 그래프 |정렬= |크기= |1번 색=|1번 수치= |2번 색=|2번 수치= ︙ }}
- 현재는 10개, 즉 10번 색과 수치까지만 입력할 수 있습니다.
- 모든 수치의 합은 반드시 100이 되어야 하며 단위 없이 숫자만 입력하면 됩니다.
- 크기 변수는 선택이며 px 단위로 너비와 높이를 조정할 수 있습니다. 기본값은 200px입니다. %로도 입력할 수 있으나 권장하지 않습니다.
- 정렬 변수는 선택이며, 가운데나 오른쪽을 입력하여 위치를 조정할 수 있습니다. 기본값은 왼쪽 정렬입니다.
사용 예제
문법 | 결과 |
---|---|
green 30%, blue 70%의 그래프
{{원형 그래프 |정렬=가운데 |크기=150px |1번 색=green|1번 수치=30 |2번 색=blue|2번 수치=70 }} |
|
green 30%, blue 45%, orange 25%의 그래프
{{원형 그래프 |정렬=가운데 |크기=150px |1번 색=green|1번 수치=30 |2번 색=blue|2번 수치=45 |3번 색=orange|3번 수치=25 }} |