Ҡалып:Круговая диаграмма
Шаблон {{Круговая диаграмма}} предназначен для вставки в статьи круговых диаграмм, иллюстрирующих процентное распределение каких-либо параметров.
Использование
Секторов может быть от 1 до 15 штук, а также дополнительный сектор «Остальное». Чтобы добавить сектор, скопируйте три строки: описание, значение и цвет, и измените номер сектора.
{{Круговая диаграмма |расположение = |ширина = |заголовок = |other = |описание1 = |значение1 = |цвет1 = |описание2 = |значение2 = |цвет2 = |описание3 = |значение3 = |цвет3 = |описание4 = |значение4 = |цвет4 = }}
Описание параметров
- расположение — показывает расположение диаграммы, имеет два значения right (справа) или left (слева) (по умолчанию «right»).
- ширина — ширина блока диаграммы (по умолчанию «200px»).
- заголовок — текстовая строка, расположенная выше списка секторов.
- other — текстовая строка, описывающая в списке секторов остаток значений до 100% (например Другие или Иначе). Без параметра - не показывает остаток в списке секторов.
- описаниеN — текстовая строка, описывающая название сектора в списке секторов.
- значениеN — размер сектора (в процентах). Знак процента ставить не нужно.
- цветN — цвет сектора, в случае если Вы хотите использовать нестандартный цвет. По умолчанию подставляется цвет из таблицы ниже.
Таблица цветов по умолчанию
По умолчанию, цвета секторов выставляются следующим образом (в зависимости от номера сектора):
- red
- green
- blue
- yellow
- fuchsia
- aqua
- brown
- orange
- purple
- sienna
- crimson
- lime
- teal
- olive
- gray
- other (остальное)
Ограничения
- Шаблон не всегда корректно работает на мобильных устройствах.
- Значения должны быть указаны в процентах.
- Google Chrome и Safari не до конца сглаживают границы секторов, так что линии получаются немного неровными.
- Шаблон не работает в браузере Internet Explorer 6-й версии и ниже, а в браузере Internet Explorer 7 отображается с искажениями.
- Описания секторов ставятся не на сами сектора (на изображение), а только в список секторов.
Как это работает
Это экспериментальный шаблон, который рисует круговую диаграмму, используя единое изображение, сгенерированное анализатором функций с помощью CSS кода, и не является JavaScript-ом. Идея в том, что прозрачные смежные границы блоков подрезаются браузером под углом .
Во избежание поломок страниц, использующих данный шаблон, желательно экспериментировать в своём личном пространстве.