Википедия:Создание временных диаграмм

Начало

Одномерные и двухмерные диаграммы в викитексте можно задавать с помощью расширения mw:Extension:EasyTimeline.

Диаграмма задаётся сценарием между специальными тегами:

 <timeline>
  сценарий
 </timeline>

Пример простой диаграммы, визуализирующей размещение простых чисел от 2 до 37:

<timeline>
ImageSize = width:400 height:30
PlotArea = left:0 bottom:0 top:0 right:0
Period = from:0 till:40
TimeAxis = orientation:hor
PlotData=
  from:2 till:2   text:2
  from:3 till:3   text:3
  from:5 till:5   text:5
  from:7 till:7   text:7
  from:11 till:11 text:11
  from:13 till:13 text:13
  from:17 till:17 text:17
  from:19 till:19 text:19
  from:23 till:23 text:23
  from:29 till:29 text:29
  from:31 till:31 text:31
  from:37 till:37 text:37
</timeline>

Расположение текста можно изменить на более читаемое, а также добавить ссылки:

ImageSize = width:400 height:35
PlotArea = left:0 bottom:0 top:0 right:0
Period = from:0 till:40
TimeAxis = orientation:hor

Define $dx1 = -2
Define $dx2 = -5
Define $dy = 15

PlotData=
  from:2 till:2 shift: ($dx1, $dy) text:[[2]]
  from:3 till:3 shift: ($dx1, $dy) text:[[3]]
  from:5 till:5 shift: ($dx1, $dy) text:[[5]]
  from:7 till:7 shift: ($dx1, $dy) text:[[7]]
  from:11 till:11 shift: ($dx2, $dy) text:[[11]]
  from:13 till:13 shift: ($dx2, $dy) text:[[13]]
  from:17 till:17 shift: ($dx2, $dy) text:[[17]]
  from:19 till:19 shift: ($dx2, $dy) text:[[19]]
  from:23 till:23 shift: ($dx2, $dy) text:[[23]]
  from:29 till:29 shift: ($dx2, $dy) text:[[29]]
  from:31 till:31 shift: ($dx2, $dy) text:[[31]]
  from:37 till:37 shift: ($dx2, $dy) text:[[37]]

Доступны команды

Общее размещение: #ImageSize, #PlotArea, #Colors, #BackgroundColors, #AlignBars
Интерпретация и представление дат и периодов: #DateFormat, #Period, #ScaleMajor, #ScaleMinor, #TimeAxis
События, периоды и описывающий текст: #PlotData, #TextData
Упорядочивание, разделение, имена групп событий и периодов: #BarData, #Legend, #LineData
Ссылки на части кода повторяющиеся много раз: #Define

Следующие команды обязательны: #ImageSize, #PlotArea, #Period, #TimeAxis. Также необходима как минимум одна команда #PlotData или #TextData. Каждая из них может повторяться множество раз. Все остальные команды необязательны.

ImageSize

Устанавливает общий размер изображения.

width: ширина, максимум 1600, минимум 25
height: высоты максимум 1200, минимум 25

Также размер может быть установлен в auto, если число прямоугольников из которых состоит диаграмма часто меняется. В этом случае должен быть установлен параметр:

barincrement: размер, который должен быть добавлен к общему размеру изображения для каждого нового прямоугольника.

PlotArea

Параметры left, top, right, bottom задают расстояние между соответственно левыми, верхними, правыми и нижними границами всего изображения и области рисования

Period

Период времени от (параметр from) и до (till), который должен быть отображён на диаграмме. Даты должны быть определены в соответствии с #DateFormat.

TimeAxis

Определяет ориентацию диаграммы.

orientation: горизонтальная (hor) или вертикальная (ver).
order: задаёт обратное (reverse) расположение.

PlotData

Используется для определения прямоугольников и добавления текста к этим прямоугольникам. Для текста, который не связан с определённым периодом или требует расширенного форматирования используйте команду TextData.

Атрибуты расположения

at: Определяет дату, на которой должен размещаться текст. В зависимости от атрибута align текст начинается, заканчивается или размещается в центре указанной позиции.
from: Определяет дату, с которой должен начинаться прямоугольник. Используете значение start для указания минимального значения в диаграмме.
till: Определяет дату, на которой заканчивается прямоугольник. Используйте параметр end для обозначения максимального значения в диаграмме.
shift: Определяет горизонтальное и вертикальное смещение для текста.

PlotData=
  bar:Japan from:start      till:19/02/1945 color:JT
  bar:Japan from:19/02/1945 till:14/03/1945 color:AI
  bar:Japan from:02/09/1945 till:end        color:AO

  at:07/12/1941 shift:(0,-15) text:"<-- WW2 reaches Asia"

Атрибуты прямоугольника

bar: Определяет к какому прямоугольнику применяются все остальные атрибуты.
color: Определяет цвет прямоугольника. color должен быть прежде определён командой #Colors.
width: Определяет размер прямоугольника в абсолютных или относительных измерениях.

Текстовые атрибуты

text: Определяет текст, возможно со ссылками, который отображается рядом с прямоугольником. Позиция задаётся напрямую через at или косвенно через from или till. Во втором случае текст располагается в середине прямоугольника.
textcolor: Определяет цвет текста. Цвет должен быть определён выше командой #Colors. По умолчанию используется черный цвет.
fontsize: Определяет размер между 6 и 30, или (предпочтительно) один из тэгов XS, S (по умолчанию), M, L, XL.
align: Выравнивание по центру (center, по умолчанию), по левому (left) или правому (right) краю.
link: Определяет ссылку.

PlotData=
   bar:US at:07/12/1941 align:left textcolor:black fontsize:XS text:7/12 [[Pearl Harbour]]

Атрибуты маркера

mark: Помещает маркер в прямоугольник в заданную позицию. Определяется как mark:(symbol, color). symbol может принимать только значение line. color должен быть определён прежде командой #Colors. Если цвет не определён используется чёрный.

PlotData=
  bar:test width:15 color:red
  from:1900 till:2000
  at:1990 mark:(line,white)

Colors

Команда позволяет привязывать цвета к идентификаторам. Другие команды должны ссылаться на идентификаторы, определённые здесь. Команда определяет один или более цветов, каждый в отдельной строке с отступом.

id: Другие команды должны использовать этот идентификатор для ссылок на цвет.
value: Определение цвета. Это должно быть:

предопределённая константа;
rgb (red, green, blue): определяет RGB цвет, значения от 0 до 1;
hsv (hue, saturation, value): определяет HSV цвет, три значения от 0 до 1;
gray (value): определяет серый цвет между 0 (чёрный) и 1 (белый).

legend: Определяет текст, который должен отображаться рядом с этим цветом в легенде

Colors =
  id:war       value:red   legend:Война
  id:peace     value:blue  legend:Мирное время
  id:treaty    value:rgb(0.6,0,0.6)
  id:lightgrey value:gray(0.9)
  id:darkgrey  value:gray(0.1)

DateFormat

Определяет как даты, используемые в других командах, должны интерпретироваться.

Допустимыми форматами являются:

dd/mm/yyyy: Дата воспринимается как день/месяц/год (только для дат с 01/01/1800).
mm/dd/yyyy: Дата воспринимается как месяц/день/год (только для дат с 01/01/1800).
yyyy: Целое значение между −9999 и +9999.

DateFormat = mm/dd/yyyy

Define

Команда позволяет создавать ссылки на текстовые константы, которые встречаются много раз. Должны начинаться с символа $.

Define $broad       = width:30
Define $narrow      = width:10
Define $bardefaults = $broad fontsize:S

Ссылки

Полное описание синтаксиса EasyTimeline (англ.)