Ҡалып:Круговая диаграмма

Википедия — ирекле энциклопедия мәғлүмәте
Перейти к навигации Перейти к поиску
(i) Документация

Шаблон {{Круговая диаграмма}} предназначен для вставки в статьи круговых диаграмм, иллюстрирующих процентное распределение каких-либо параметров.





Circle frame.svg

  Один (42%)

  Два (32%)

  Три (12%)

  Четыре (3%)

  Пять (2%)

  Шесть (1%)

  Остальное (8%)







Circle frame.svg

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

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

  Католики (26.8%)

  Протестанты (2.5%)

  Другие (11.7%)

Использование

Секторов может быть от 1 до 15 штук, а также дополнительный сектор «Остальное». Чтобы добавить сектор, скопируйте три строки: описание, значение и цвет, и измените номер сектора.

{{Круговая диаграмма
|расположение = 
|ширина       =
|заголовок    = 
|other        = 
|описание1    = 
|значение1    = 
|цвет1        = 
|описание2    = 
|значение2    = 
|цвет2        =
|описание3    = 
|значение3    = 
|цвет3        =
|описание4    = 
|значение4    = 
|цвет4        =
}}

Описание параметров

  • расположение — показывает расположение диаграммы, имеет два значения right (справа) или left (слева) (по умолчанию «right»).
  • ширина — ширина блока диаграммы (по умолчанию «200px»).
  • заголовок — текстовая строка, расположенная выше списка секторов.
  • other — текстовая строка, описывающая в списке секторов остаток значений до 100% (например Другие или Иначе). Без параметра - не показывает остаток в списке секторов.
  • описаниеN — текстовая строка, описывающая название сектора в списке секторов.
  • значениеN — размер сектора (в процентах). Знак процента ставить не нужно.
  • цветN — цвет сектора, в случае если Вы хотите использовать нестандартный цвет. По умолчанию подставляется цвет из таблицы ниже.

Таблица цветов по умолчанию

По умолчанию, цвета секторов выставляются следующим образом (в зависимости от номера сектора):

  1.      red
  2.      green
  3.      blue
  4.      yellow
  5.      fuchsia
  6.      aqua
  7.      brown
  8.      orange
  9.      purple
  10.      sienna
  11.      crimson
  12.      lime
  13.      teal
  14.      olive
  15.      gray
  16.      other (остальное)

Ограничения

  • Шаблон не всегда корректно работает на мобильных устройствах.
  • Значения должны быть указаны в процентах.
  • Google Chrome и Safari не до конца сглаживают границы секторов, так что линии получаются немного неровными.
  • Шаблон не работает в браузере Internet Explorer 6-й версии и ниже, а в браузере Internet Explorer 7 отображается с искажениями.
  • Описания секторов ставятся не на сами сектора (на изображение), а только в список секторов.

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

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

Во избежание поломок страниц, использующих данный шаблон, желательно экспериментировать в своём личном пространстве.