Шаблон: круговая диаграмма

Документация по шаблону [ просмотреть ] [ изменить ] [ история ] [ очистить ]

Применение

Можно указать метки и значения до 30 срезов. Ниже приведены все параметры для шести срезов; чтобы включить больше фрагментов, скопируйте код для одного из других, изменив цифру в конце имени каждого параметра.

{{Круговая диаграмма| радиус = 100| большой палец =| caption =| другое =| label1 = запомнить| значение1 = 16,6| color1 = 2| label2 = понять| значение2 = 16,6| color2 = 3| label3 = применить| значение3 = 16,6| color3 = 5| label4 = анализировать| значение4 = 16,6| color4 = 6| label5 = оценивать| значение5 = 16,6| color5 = 9| label6 = дизайн| значение6 = 16,6| color6 = 10}}

Параметр |radius=указывает радиус круговой диаграммы в пикселях. Не включайте суффикс «px». Если опущено, по умолчанию будет 100.
Параметр |thumb=указывает, на какую сторону страницы перемещается диаграмма и по умолчанию right, как и в случае с файлами изображений. Чтобы диаграмма отображалась в левой части страницы, укажите |thumb=left.
Параметр |caption=указывает строку текста, которая отображается в строке непосредственно перед легендой.
Параметр |footer=указывает строку текста, которая отображается под легендой.
Параметр |other=, если он указан, приведет к появлению в легенде элемента «Другое».
Каждый из них представляет собой строку текста, которая появляется в записи легенды для фрагмента. Если его пропустить, запись легенды для этого фрагмента не будет отображаться.|labelN=
Каждый процент представляет собой срез. Вы не включать знак процента. Также обратите внимание, что он отображается в легенде в том виде, в котором он написан (сразу после этикетки), без округления или другого переформатирования.|valueN=
Каждый из них представляет собой цветовой код или название CSS . Если опущено, по умолчанию будут использоваться следующие оттенки:|colorN=

светло-синий
сильный синий
светло-зеленый
сильный зеленый
фуксия
красный
светло-оранжевый
крепкий апельсин
светло-фиолетовый
сильный фиолетовый
светло-желтого
коричневый

Ограничения

Значения должны быть в процентах.
В Google Chrome и Safari не отображаются границы сглаживания , поэтому линии немного неровные. (Для Chrome эта проблема кажется решенной; протестировано с версией 26.)
На сами ломтики нельзя наклеивать никаких этикеток.
По сути, невозможно сохранить копию графика с помощью функции браузера «Сохранить изображение».
Максимум. количество отображаемых срезов: 30

Как это работает

Один (42%)

Двое (32%)

Трое (12%)

Четыре (3%)

Пять (2%)

Шесть (1%)

Другое (8%)

Это шаблон, который рисует круговые диаграммы с использованием одного изображения, большого количества (встроенного) кода CSS, сгенерированного функциями синтаксического анализатора, и абсолютно без JavaScript . Он использует технику рисования диагональных линий в CSS, используя тот факт, что границы, установленные на элементах, соединяются под углом . Таким образом, можно сделать одну границу непрозрачной, а остальные полностью прозрачными, чтобы сформировать диагональную линию. Углом линии можно управлять, регулируя ширину двух соседних границ (одна из которых непрозрачна) относительно друг друга.

Ломтики пирога рисуются по часовой стрелке против часовой стрелки. Эти кусочки пирога расположены:

Внутри квадратного элемента размером (2 * радиус ) x (2 * радиус ) пикселей
с для круглой формыborder-radius: radiuspx
с белым фоном (видимым в пустом пространстве, которое появляется, если присутствует "другой" фрагмент)
и с overflow: hidden;набором.

Это позволяет видеть на странице только ту часть каждого фрагмента, которая находится внутри круга.

Большая часть кода разделена на пять разделов, первые четыре соответствуют квадрантам круга, а последний полностью покрывает случай, когда один фрагмент занимает 100% диаграммы.{{Pie chart/slice}}

Пример

Религия в Чехии по состоянию на 2001 год.

Атеисты и агностики (59%)

Католики (26,8%)

Протестанты (2,5%)

Другое (11,7%)

Следующий пример шаблона: Круговая диаграмма генерирует круговую диаграмму, показанную справа.

 {{Круговая диаграмма | caption = [[Религия в Чешской Республике]] по состоянию на 2001 год. | другое = да | label1 = [[Атеисты]] и [[Агностицизм | агностики]] | значение1 = 59 | color1 = серебро | label2 = [[Католическая церковь | Католики]] | значение2 = 26,8 | цвет2 = # 008 | label3 = [[протестантизм | протестанты]] | значение3 = 2,5 | color3 = # 08f }}

Смотрите также

{{ Блок-схема }}
{{ Панель композиции }}
Модуль: Диаграмма

Отформатированный / раскрашенный источник шаблона для шаблона: круговая диаграмма

{{{ thumb | right }}} " {{# if : {{{ style | }}}
| style = " {{{ style | }}} " }} >

{{# expr : 2 * {{{ radius | 100 }}} +2 } } px ">

{{# expr : 2 * {{{ radius | 100 }}} } } px; height: {{# expr : 2 * {{ radius | 100 }}} }} px; overflow: hidden; border-radius: {{{ radius | 100 }}} px; border: 1px сплошной черный " > {{# if : {{{ value30 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color30 | {{ gcolor | 30 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} + {{{ value17 }}} + {{{ value18 }}} + { {{ value19 }}} + {{{ value20 }}} + {{{ value21 }}} + {{{ value22 }}} + {{{ value23 }}} + {{{ value24 }}} + {{{ значение25 }}} + {{{ значение26 }}} + {{{ значение27 }}} + {{{ значение28 }}} + {{{ значение29 }}} + {{{ значение30 }}} }} }} }} {{# if : {{{ value29 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color29 | {{ gcolor | 29 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} +{{{ value17 }}} + {{{ value18 }}} + {{{ value19 }}} + {{{ value20 }}} + {{{ value21 }}} + {{{ value22 }}} + {{ { value23 }}} + {{{ value24 }}} + {{{ value25 }}} + {{{ value26 }}} + {{{ value27 }}} + {{{ value28 }}} + {{{ value29) }}} }} }} }} {{# if : {{{ value28 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color28 | {{ gcolor | 28 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} + {{{ value17 }}} + {{{ value18 }}} + { {{ value19 }}} + {{{ value20 }}} + {{{ value21 }}} + {{{ value22 }}} + {{{ value23 }}} + {{{ value24 }}} + {{{ value25 }}} + {{{ value26 }}} + {{{ value27 }}} + {{{ value28 }}} }} }} }} {{# if : {{{ value27 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color27 | {{ gcolor | 27 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} + {{{ value17 }}} + {{{ value18 }}} + { {{ value19 }}} + {{{ value20 }}} + {{{ value21 }}} + {{{ value22 }}} + {{{ value23 }}} + {{{ value24 }}} + {{{ value25 }}} + {{{ value26 }}} + {{{ value27 }} }} }} }} {{# if : {{{ value26 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color26 | {{ gcolor | 26 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} + {{{ value17 }}} + {{{ value18 }}} + { {{ value19 }}} + {{{ value20 }}} + {{{ value21 }}} + {{{ value22 }}} + {{{ value23 }}} + {{{ value24 }}} + {{{ value25 }}} + {{{ value26 }}} }} }} }} {{# if : {{{ value25 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color25 | {{ gcolor | 25 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} + {{{ value17 }}} + {{{ value18 }}} + { {{ value19 }}} + {{{ value20 }}} + {{{ value21 }}} + {{{ value22 }}} + {{{ value23 }}} + {{{ value24 }}} + {{{ value25 }}} }} }} }} {{# if : {{{ value24 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color24 | {{ gcolor | 24 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} + {{{ value17 }}} + {{{ value18 }}} + { {{ значение19 }}} + {{{ значение20 }}} + {{{ значение21 }}} + {{{ значение22 }}} + {{{ значение23 }}} + {{{ значение24 }}} }} }} }} {{# if : {{{ value23 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color23 | {{ gcolor | 23 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} + {{{ value17 }}} + {{{ value18 }}} + { {{ value19 }}} + {{{ value20 }}} + {{{ value21 }}} + {{{ value22 }}} + {{{ value23 }}} }} }} }} {{# if : {{{ value22 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color22 | {{ gcolor | 22 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} + {{{ value17 }}} + {{{ value18 }}} + { {{ value19 }}} + {{{ value20 }}} + {{{ value21 }}}} + {{{ value22 }}} }} }} }} {{# if : {{ { value21 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color21 | {{ gcolor | 21 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} + {{{ value17 }}} + {{{ value18 }}} + { {{ value19 }}} + {{{ value20 }}} + {{{ value21 }}} }} }} }} {{# if : {{{ value20 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color20 | {{ gcolor | 20 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} + {{{ value17 }}} + {{{ value18 }}} + { {{ value19 }}} + {{{ value20 }}} }} }} }} {{# if : {{{ value19 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color19 | {{ gcolor | 19 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} + {{{ value17 }}} + {{{ value18 }}} + { {{ value19 }}} }} }} }} {{# if : {{{ value18 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color18 | {{ gcolor | 18 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ значение13 }}} + {{{ значение14 }}} + {{{ значение15 }}} + {{{ значение16 }}} + {{{ значение17 }}} + {{{ значение18 }}} }} }} }} {{# if : {{{ value17 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color17 | {{ gcolor | 17 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }}} + {{{ value17 }}} }} }} }} {{# if : {{{ value16 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color16 | {{ gcolor | 16 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} + {{{ value16 }} }} }} }} {{# if : {{{ value15 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color15 | {{ gcolor | 15 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} + {{{ value15 }}} }} }} }} {{# if : {{{ value14 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color14 | {{ gcolor | 14 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }}} + {{{ value14 }}} }} }} }} {{# if :{{{ value13 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color13 | {{ gcolor | 13 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10}}} + {{{ value11 }}} + {{{ value12 }}} + {{{ value13 }} }} }} }} {{# if : {{{ value12 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color12 | {{ gcolor | 12 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} + {{{ value12 }}} }} }} }} {{# if : {{{ value11 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color11 | {{ gcolor | 11 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} + {{{ value11 }}} }} }} }} {{# if : {{{ value10 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color10 | {{ gcolor | 10 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }}} + {{{ value10 }}} }} }} }} {{# если : {{{ value9 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color9 | {{ gcolor | 9 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} + {{{ value9 }} }} }} }} {{# if : {{{ value8 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color8 | {{ gcolor | 8 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} + {{{ value8 }}} }} }} }} {{# if : {{{ value7 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color7 | {{ gcolor | 7 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} + {{{ value7 }}} }} }} } {{# if : {{{ value6 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color6 | {{ gcolor | 6 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }}} + {{{ значение6 } }} }} }} }} {{# if : {{{ value5 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color5 | {{ gcolor | 5 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }}} + {{{ значение5 }} }} }} }} {{# if : {{{ value4 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color4 | {{ gcolor | 4 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} + {{{ значение4 }} }} }} }} { {# if : {{{ value3 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color3 | {{ gcolor | 3 }} }}}
        | {{# expr : {{{ значение1 }}} + {{{ значение2 }}} + {{{ значение3 }}} }} }} }} {{# if : {{{ значение2 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color2 | {{ gcolor | 2 }} }}}
        | {{# expr : {{{ value1 }}} + {{{ value2 }} }} }} }} {{# if : {{{ value1 | }}}
    | {{ Круговая диаграмма / фрагмент | radius = {{{ radius | 100 }}}
        | {{{ color1 | {{ gcolor | 1 }} }}}
        | {{{ value1 }}} }} }}

{{{ caption | }}} {{# if : {{{ label1 | }}}
    | {{ легенда | {{{ color1 | {{ gcolor | 1 }} }}}
        | {{{ label1 }}} ( {{{ value1 }}} %) }} }} {{# if : {{{ label2 | }}}
    | {{ легенда | {{{ color2 | {{ gcolor | 2 }} }}}
        | {{{ label2 }}} ( {{{ value2 }}} %) }} }} {{# if : {{{ label3 | }}}
    | {{ легенда | {{{ color3 | {{ gcolor | 3 }} }}}
        | {{{ label3 }}} ( {{{ value3 }}} %) }} }} {{# if : {{{ label4 | }}}
    | {{ легенда | {{{ color4 | {{ gcolor | 4 }} }}}
        | {{{ label4 }}} ( {{{ value4 }}} %) }} }} {{# if : {{{ label5 | }}}
    | {{ легенда | {{{ color5 | {{ gcolor | 5 }} }}}
        | {{{ label5 }}} ( {{{ value5 }}} %) }} }} {{# if : {{{ label6 | }}}
    | {{ легенда | {{{ color6 | {{ gcolor | 6 }} }}}
        | {{{ label6 }}} ( {{{ value6 }}} %) }} }} {{# if : {{{ label7 | }}}
    | {{ легенда | {{{ color7 | {{ gcolor | 7 }} }}}
        | {{{ label7 }}} ( {{{ value7 }}} %) }} }} {{# if : {{{ label8 | }}}
    | {{ легенда | {{{ color8 | {{ gcolor | 8 }} }}}
        | {{{ label8 }}} ( {{{ value8 }}} %) }} }} {{# if : {{{ label9 | }}}
    | {{ легенда | {{{ color9 | {{ gcolor | 9 }} }}}
        | {{{ label9 }}} ( {{{ value9 }}} %) }} }} {{# if : {{{ label10 | }}}
    | {{ легенда | {{{ color10 | {{ gcolor | 10 }} }}}
        | {{{ label10 }}} ( {{{ value10 }}} %) }} }} {{# if : {{{ label11 | }}}
    | {{ легенда | {{{ color11 | {{ gcolor | 11 }} }}}
        | {{{ label11 }}} ( {{{ value11 }}} %) }} }} {{# if : {{{ label12 | }}}
    | {{ легенда | {{{ color12 | {{ gcolor | 12 }} }}}
        | {{{ label12 }}} ( {{{ value12 }}} %) }} }} {{# if : {{{ label13 | }}}
    | {{ легенда | {{{ color13 | {{ gcolor | 13 }} }}}
        | {{{ label13 }}} ( {{{ value13 }}} %) }} }} {{# if : {{{ label14 | }}}
    | {{ легенда | {{{ color14 | {{ gcolor | 14 }} }}}
        | {{{ label14 }}} ( {{{ value14 }}} %) }} }} {{# if : {{{ label15 | }}}
    | {{ легенда | {{{ color15 | {{ gcolor | 15 }} }}}
        | {{{ label15 }}} ( {{{ value15 }}} %) }} }} {{# if : {{{ label16 | }}}
    | {{ легенда | {{{ color16 | {{ gcolor | 16 }} }}}
        | {{{ label16 }}} ( {{{ value16 }}} %) }} }} {{# if : {{{ label17 | }}}
    | {{ легенда | {{{ color17 | {{ gcolor | 17 }} }}}
        | {{{ label17 }}} ( {{{ value17 }}} %) }} }} {{# if : {{{ label18 | }}}
    | {{ легенда | {{{ color18 | {{ gcolor | 18 }} }}}
        | {{{ label18 }}} ( {{{ value18 }}} %) }} }} {{# if : {{{ label19 | }}}
    | {{ легенда | {{{ color19 | {{ gcolor | 19 }} }}}
        | {{{ label19 }}} ( {{{ value19 }}} %) }} }} {{# if : {{{ label20 | }}}
    | {{ легенда | {{{ color20 | {{ gcolor | 20 }} }}}
        | {{{ label20 }}} ( {{{ value20 }}} %) }} }} {{# if : {{{ label21 | }}}
    | {{ легенда | {{{ color21 | {{ gcolor | 21 }} }}}
        | {{{ label21 }}} ( {{{ value21 }}} %) }} }} {{# if : {{{ label22 | }}}
    | {{ легенда | {{{ color22 | {{ gcolor | 22 }} }}}
        | {{{ label22 }}} ( {{{ value22 }}} %) }} }} {{# if : {{{ label23 | }}}
    | {{ легенда | {{{ color23 | {{ gcolor | 23 }} }}}
        | {{{ label23 }}} ( {{{ value23 }}} %) }} }} {{# if : {{{ label24 | }}}
    | {{ легенда | {{{ color24 | {{ gcolor | 24 }} }}}
        | {{{ label24 }}} ( {{{ value24 }}} %) }} }} {{# if : {{{ label25 | }}}
    | {{ легенда | {{{ color25 | {{ gcolor | 25 }} }}}
        | {{{ label25 }}} ( {{{ value25 }}} %) }} }} {{# if : {{{ label26 | }}}
    | {{ легенда | {{{ color26 | {{ gcolor | 26 }} }}}
        | {{{ label26 }}} ( {{{ value26 }}} %) }} }} {{# if : {{{ label27 | }}}
    | {{ легенда | {{{ color27 | {{ gcolor | 27 }} }}}
        | {{{ label27 }}} ( {{{ value27 }}} %) }} }} {{# if : {{{ label28 | }}}
    | {{ легенда | {{{ color28 | {{ gcolor | 28 }} }}}
        | {{{ label28 }}} ( {{{ value28 }}} %) }} }} {{# if : {{{ label29 | }}}
    | {{ легенда | {{{ color29 | {{ gcolor | 29 }} }}}
        | {{{ label29 }}} ( {{{ value29 }}} %) }} }} {{# if : {{{ label30 | }}}
    | {{ легенда | {{{ color30 | {{ gcolor | 30 }} }}}
        | {{{ label30 }}} ( {{{ value30 }}} %) }} }} {{# if : {{{ other | }}}
    | {{ legend | white
        | Other ( {{# expr : 100- {{{ value1 | 0 }}} - {{{ value2 | 0 }}} - {{{ value3 | 0 }}} - {{{ value4 | 0 }}} - {{{ value5 | 0 }}} - {{{ value6 | 0 }}} - {{{ value7 | 0 }}} - {{{ value8 | 0 }}} - {{{ value9 | 0 }}} - {{{ value10 | 0 }}} - {{{ value11 | 0 }}} - {{{ value12 | 0 }}} - {{{ value13 | 0 }}} - {{{ value14 | 0 }}} - {{{ value15 | 0 }}} - {{{ value16 | 0 }}} - {{{ value17 | 0 }}} - {{{ value18 | 0 }}} - {{{ value19 | 0 }}} - {{{ value20 | 0 }}} - {{{ value21 | 0 }}} - {{{ value22 | 0 }}} - {{{ value23 | 0 }}} - {{{ value24 | 0 }}} - {{{ value25 | 0 }}} - {{{ value26 | 0 }}} - {{{ value27 | 0 }}} - {{{ value28 | 0 }}} - {{{ value29 | 0 }}} - {{{ value30 | 0 }}} }} %) }} }} {{# if : {{{ footer | }}}
    |

{{{ footer }}}

}}

{{ документация }} -> :

Отформатированный / раскрашенный источник шаблона для шаблона: круговая диаграмма / фрагмент

{{{ radius | 100 }}} px; line-height: 0; {{# switch : {{# expr : floor ( {{ { 2 }}} / 25) }}
| 0 = left: {{{ radius | 100 }}} px; top: {{# expr : {{{ radius | 100} }}} * (1-sin (pi / 50 * {{{ 2 }}} )) }} px; border-width: 0 0 {{# expr : {{{ radius | 100 }}} * sin (pi / 50 * {{{ 2 }}} ) }} px {{# expr : {{{ radius | 100 }}} * cos (pi / 50 * {{{ 2 }}} ) }} px; нижняя граница -color: {{{ 1 }}} ">

| 1 = right: {{{ radius | 100 }}} пикселей; верх: 0; border-width: 0 {{# expr : {{{ radius | 100 }}} * tan (pi / 50 * ( {{{ 2 }}} -25)) }} пикселей {{{ radius | 100 }}} px 0; border-right-color: {{{ 1 }}} ">

{{{ radius | 100 }}} px {{{ radius | 100 }}} px 0; border-color: {{{ 1 }}} ">

| 2 = справа: {{{ radius | 100 }}} пикселей; сверху: {{{ radius | 100 }}} пикселей; ширина границы: {{# expr : {{{ radius | 100 }}}) * sin (pi / 50 * ( {{{ 2 }}} -50)) }} px {{# expr : {{{ radius | 100 }}} * cos (pi / 50 * ( {{{ 2 }} } -50)) }} px 0 0; border-top-color: {{{ 1 }}} ">