Hilfe:Zeitleisten
Diese Hilfeseite beschreibt die MediaWiki-Erweiterung EasyTimeline.
Die Übersetzung basiert auf der Originalseite bei MediaWiki.
Verwendung
Mit der Erweiterung EasyTimeline lassen sich graphische Zeitleisten erstellen, das heißt Balkendiagramme zu zeitlichen Abläufen. Dazu wird ein Baustein mit der folgenden Syntax eingefügt:
<timeline> skript </timeline>
Dem Programm EasyTimeline wird dadurch mitgeteilt, eine PNG-Grafik zu erzeugen, die optional auch klickbare Links enthalten kann.
Hinweis: Obwohl EasyTimeline für einfache Benutzung entwickelt wurde, ist eine komplexe graphische Zeitleiste eine nicht-triviale Angelegenheit. Für eine einfache Zeitleiste benötigt man etwa eine halbe Stunde oder weniger, wenn man ein brauchbares Beispiel als Vorlage nimmt. Für umfangreiche Zeitleisten braucht man einige Stunden zur Erstellung und für die Feinjustierung. Dafür ist es aber relativ einfach, eine existierende Zeitleiste zu korrigieren oder zu ergänzen. Das gilt auch für Benutzer, die sich in die hier beschriebenen Syntax noch nicht eingearbeitet haben.
Für Fragen und Hilfestellung steht Erik Zachte zur Verfügung, der Autor von EasyTimeline.
Bitte erstelle eine Zeitleiste in einer Vorlage, um den Artikeltext nicht zu stören. In der jeweiligen Vorlage verwende bitte die Kategorie „Zeitleiste“ wie folgt:
<noinclude>[[Kategorie:Vorlage:Zeitleiste|Name der Vorlage]]</noinclude>
Auf diesem Wege wird verhindert, dass der Artikel die Kategorie erbt.
Vorhandene Befehle
Die Skriptbefehle definieren:
- Gesamtlayout: ImageSize, PlotArea, Colors, BackgroundColors, AlignBars
- Interpretation und Präsentation der Daten und Perioden: DateFormat, Period, ScaleMajor, ScaleMinor, TimeAxis
- Ereignisse, Perioden und Beschreibungen: PlotData, TextData
- Sortieren, Aufteilen und Benennen: BarData, Legend, LineData
- Abkürzungen für mehrfach verwendeten Skript-Code: Define
Nur drei Befehle sind zwingend notwendig: ImageSize, PlotArea und Period. Zumindest eins der folgenden muss vorhanden sein: PlotData und/oder TextData. Eins davon oder beide kann mehrfach auftreten. Alle anderen Befehle sind optional.
Schreibweise: Befehle und deren Attribute können klein, groß oder gemischt geschrieben werden. Bitte versuche für die Lesbarkeit ein konsistentes System zu benutzen, z. B. gemischte Schreibweise für Befehle und Kleinschreibung für Attribute.
Allgemeine Syntax
Ein Skript kann Befehle und Kommentare beinhalten. Jedem Befehl folgen ein oder mehrere Attribute.
Befehle
Befehle sollten am Beginn einer Zeile stehen. Einige Befehle können von mehrzeiligen Datenzeilen und/oder Optionen gefolgt werden. Diese Extrazeilen sollten mindestens mit einem Leerschritt oder besser mit einer Leerzeile beginnen. Das dient der Gruppierung und damit der Lesbarkeit des Skripts.
Befehle haben eine der folgenden, vom Typ abhängigen, Formen:
Befehl = Attribut
DateFormat = dd/mm/yyyy
Befehl Name = Attribut(e)
Color Jp = value:red legend:Japan
Befehl =
Attribut(e)
Attribut(e)
etc.
PlotData = fontsize:XS width:20 bar:Japan from:start till:19/02/1945 color:JT bar:Japan from:19/02/1945 till:14/03/1945 color:AI
Kommentare
Ein- und mehrzeilige Kommentare können so geschrieben werden:
- Text nach dem Hash-Zeichen # wird als Kommentar erkannt
- Text zwischen #> und <# wird ebenso als Kommentar erkannt. Damit sind mehrzeilige Kommentare möglich.
Beispiele:
Dateformat = dd/mm/yyyy # Europäisches Datumsformat
Period = from:01/09/1939 till:02/09/1945 #> Diese Tabelle zeigt die komplette
Dauer des 2. Weltkriegs<#
Attribute
Wenn verschiedene Attribute für einen bestimmten Befehl angegeben werden können, so werden sie als Paare Name:Wert übergeben. Wenn mehrere Werte für ein Attribut angegeben werden, so müssen sie eingeklammert werden.
Beispiele:
AlignBars = justify Color SSch = value:rgb(0.8,0,0.7) legend:See-Schlachten
Parameter vs. Data Items
Die meisten Befehle akzeptieren nur Attribute, die in derselben Zeile stehen.
Datenblöcke: Einige Befehle wie BarData, PlotData, TextData, Colors erwarten einen Datenblock, der aus einer oder mehreren Datenzeilen besteht. Diese müssen mit einem oder mehr Leerzeichen beginnen. Ein Datenblock wird als beendet erkannt, wenn eine Zeile eingelesen wird, die nicht mit einem Leerzeichen beginnt. Ausnahme: Leerzeilen werden ignoriert, damit die Datenblöcke untergliedert werden können.
Attribute in einem Datenblock können eingeteilt werden in Parameter und Datenobjekte. Diese können innerhalb der Datenblöcke vermischt auftreten.
Datenobjekte: In Datenzeilen gelten die Attribute text, from, till und at ausschließlich für die aktuelle Zeile.
Parameter: In Datenzeilen haben Attribute wie color und fontsize je nach Kontext unterschiedliche Auswirkungen. Wenn diese Parameter in einer Zeile ohne Datensatz stehen, dann setzen sie neue Standards für die nachfolgenden Datenzeilen. Wenn sie in einer Zeile zusammen mit Datensätzen stehen, dann gelten sie nur für diese Zeile.
Beispiel:
# In diesem Beispiel werden zwei Säulengruppen gezeichnet, in rot bzw. blau, # aber in jeder Gruppe wird eine Säule (Krieg darstellend) in grün dargestellt. PlotData = color:red fontsize:S # Standards setzen bar:USSR from:1919 till:1922 text:Lenin # rote Säule bar:USSR from:1922 till:1953 text:Stalin # rote Säule bar:USSR from:1939 till:1945 text:WWII color:green # grüne Säule bar:USSR from:1953 till:1964 text:Chruschtschow # rote Säule color:blue # Standardfarbe ändern bar:US from:1913 till:1921 text:Wilson # blaue Säule bar:US from:1917 till:1918 text:WWI color:green # grüne Säule bar:US from:1921 till:1923 text:Harding # blaue Säule #> Dieser mehrzeilige Kommentar beendet keineswegs den PlotData-Block, auch wenn die vorherige Zeile nicht mit einem Leerzeichen beginnt<# bar:US from:1923 till:1929 text:Coolidge # blaue Säule TextData = # JETZT ist der PlotData-Block abgeschlossen tabs:...etc
<timeline> ImageSize = width:250 height:700 PlotArea = width:250 height:700 left:0 bottom:0 TimeAxis = orientation:vertical # dummy, required Period = from:1910 till:1965 Colors =
id:canvas value:rgb(1,1,0.85)
BackgroundColors = canvas:canvas
- In diesem Beispiel werden zwei Säulengruppen gezeichnet, in rot bzw. blau,
- aber in jeder Gruppe wird eine Säule (Krieg darstellend) in grün dargestellt.
PlotData =
color:red fontsize:S # Standards setzen bar:USSR from:1919 till:1922 text:Lenin # rote Säule bar:USSR from:1922 till:1953 text:Stalin # rote Säule bar:USSR from:1939 till:1945 text:WWII color:green # grüne Säule bar:USSR from:1953 till:1964 text:Chruschtschow # rote Säule
color:blue # Standardfarbe ändern bar:US from:1913 till:1921 text:Wilson # blaue Säule bar:US from:1917 till:1918 text:WWI color:green # grüne Säule bar:US from:1921 till:1923 text:Harding # blaue Säule
#> Dieser mehrzeilige Kommentar beendet keineswegs den PlotData-Block, auch wenn die vorherige Zeile nicht mit einem Leerzeichen beginnt<#
bar:US from:1923 till:1929 text:Coolidge # blaue Säule
TextData =
pos:(20,17) textcolor:black fontsize:S tabs:(10-left,14-left,50-left,90-left,230-left) text:^Demonstration^^^Präsidenten (UDSSR,USA) </timeline>
Spezielle Zeichen
- #, #>, <# (Hash, Hash+"größer als", "kleiner als"+Hash): siehe Kommentare
- ~ (Tilde) im Text bedeutet: Zeilenumbruch
- ^ (Karet) im Text bedeutet: Tabulator
- _ (Unterstrich) im Text bedeutet: Leerzeichen
- $ (Dollarzeichen) leitet eine benutzerdefinierte Konstante ein
Befehlsreferenz
Für jeden Befehl werden die gültigen Attribute aufgezählt. Einige Befehle und / oder Attribute dürfen fehlen ((o)ptional).
Für einige Befehle schließen sich bestimmte Attribute gegenseitig aus. Dies wird an entsprechender Stelle erwähnt.
AlignBars
Die Balken (Bars) werden immer in gleichen Abständen gezeichnet. Dieser Befehl gibt an, ob die Balken mit größtmöglichem Abstand oder mit ein paar Leerzeichen zwischen der linken/oberen Ecke der Darstellung und dem ersten Balken oder zwischen dem letzten Balken und der rechten/unteren Ecke der Darstellung gelassen werden sollen.
- early (default)
- Der erste Balken wird an linkester/oberster Position der Grafik (an der Achse 'angeklebt') dargestellt, dann wird der Raum zwischen letztem Balken und rechtem/unterem Rand automatisch bestimmt.
- late
- Gegenteil von early: der letzte Balken wird möglichst dicht an den rechten/unteren Rand platziert, dann kann ein Zwischenraum zwischen der Achse und erstem Balken erscheinen.
- justify
- Der erste und letzte Balken werden möglichst weit auseinander platziert, kein Zwischenraum an den Rändern. Wenn nur ein Balken vorhanden ist, wird 'justify' als 'zentriert’ interpretiert.
Beispiel:
| TimeAxis = orientation:horizontal | TimeAxis = orientation:vertical | |||||
|
Alignbars = |
<timeline> ImageSize = width:90 height:120 PlotArea = width:65 height:80 left:20 bottom:20 AlignBars = early DateFormat = yyyy Period = from:1 till:5 TimeAxis = orientation:horizontal ScaleMajor = unit:year increment:1 start:1 PlotData= color:red width:10 bar:A from:start till:end bar:B from:start till:end bar:C from:start till:end bar:D from:start till:end TextData= pos:(20,110) fontsize:M text:Early </timeline> |
<timeline> ImageSize = width:90 height:120 PlotArea = width:65 height:80 left:20 bottom:20 AlignBars = late DateFormat = yyyy Period = from:1 till:5 TimeAxis = orientation:horizontal ScaleMajor = unit:year increment:1 start:1 PlotData= color:red width:10 bar:A from:start till:end bar:B from:start till:end bar:C from:start till:end bar:D from:start till:end TextData= pos:(20,110) fontsize:M text:Late </timeline> |
<timeline> ImageSize = width:90 height:120 PlotArea = width:65 height:80 left:20 bottom:20 AlignBars = justify DateFormat = yyyy Period = from:1 till:5 TimeAxis = orientation:horizontal ScaleMajor = unit:year increment:1 start:1 PlotData= color:red width:10 bar:A from:start till:end bar:B from:start till:end bar:C from:start till:end bar:D from:start till:end TextData= pos:(20,110) fontsize:M text:Justify </timeline> |
<timeline> ImageSize = width:90 height:120 PlotArea = width:65 height:80 left:20 bottom:20 AlignBars = early DateFormat = yyyy Period = from:1 till:5 TimeAxis = orientation:vertical ScaleMajor = unit:year increment:1 start:1 PlotData= color:red width:10 bar:A from:start till:end bar:B from:start till:end bar:C from:start till:end bar:D from:start till:end TextData= pos:(20,110) fontsize:M text:Early </timeline> |
<timeline> ImageSize = width:90 height:120 PlotArea = width:65 height:80 left:20 bottom:20 AlignBars = late DateFormat = yyyy Period = from:1 till:5 TimeAxis = orientation:vertical ScaleMajor = unit:year increment:1 start:1 PlotData= color:red width:10 bar:A from:start till:end bar:B from:start till:end bar:C from:start till:end bar:D from:start till:end TextData= pos:(20,110) fontsize:M text:Late </timeline> |
<timeline> ImageSize = width:90 height:120 PlotArea = width:65 height:80 left:20 bottom:20 AlignBars = justify DateFormat = yyyy Period = from:1 till:5 TimeAxis = orientation:vertical ScaleMajor = unit:year increment:1 start:1 PlotData= color:red width:10 bar:A from:start till:end bar:B from:start till:end bar:C from:start till:end bar:D from:start till:end TextData= pos:(20,110) fontsize:M text:Justify </timeline> |
Hintergrundfarben
Der Befehl "BackgroundColors" erlaubt die Angabe einer Farbe für verschiedene Bereiche der Grafik.
Eine Farbkennung muss zuerst mit Hilfe von Colors definiert werden.
- canvas (O)
- Definiert eine Hintergrundfarbe für die gesamte Darstellung.
- bars (O)
- Definiert eine Hintergrundfarbe für sämtliche Balken.
Beispiele:
BackgroundColors = bars:darkgray BackgroundColors = canvas:lightgrey bars:darkgray BackgroundColors = canvas:lightgray
BarData
Das ist ein optionaler Befehl, der angibt, welche Balken im Diagramm angezeigt werden und in welcher Reihenfolge. Wenn er nicht benutzt wird, werden die Balken in der Reihenfolge ihrer Definition in PlotData dargestellt.
Für komplexe Zeitleisten mit vielen Balken ist die Verwendung dieses Befehl empfehlenswert:
- Er vereinfacht die Neusortierung der angezeigten Daten.
- Die Balkenbezeichnungen, die in PlotData angegeben werden, können mit der Liste verglichen werden, um Tippfehler zu vermeiden.
- bar
- Definiert die Balken-ID. Andere Befehle (insbesondere PlotData) erwarten diese ID als Referenz. Zudem ist dies die Beschriftung, die an der Achse angezeigt wird, außer wenn das Attribut text existiert. Die Balken-ID sollte keine Leerzeichen enthalten: verwende stattdessen Unterstriche; diese werden in Leerzeichen umgewandelt, genau wie in den Wikipediaartikelnamen.
- text (O)
- Wenn angegeben, gibt text den Text an, der anstelle der Balken-ID an der Achse angezeigt werden soll. Siehe auch die regeln für text input. Der Text kann einen Link enthalten (siehe Anmerkung 1')
- link (O)
- Gibt einen Weblink an (siehe Anmerkung 1) (URL). Die Beschriftung entlang der Achse wird als blauer anklickbarer Link angezeigt.
Anmerkungen
- Verwende entweder das Attribut link oder einen eingebetteten Link im Attribut text; nicht beides
Beispiele:
BarData =
bar:Japan
bar:US text:"United States" # referenziert in PlotData zum Balken "US",
# zeigt aber "United States" an
bar:China text:[[China]] # die Bezeichnung "China" wird als blauer,
# anklickbarer Link zum Wikipediaartikel "China" angezeigt
Die folgenden Zeilen erzeugen dieselbe Ausgabe (nur die Referenz in PlotData ändert sich):
bar:US text:[[United_States]] bar:US text:"United States" link:http://www.wikipedia.org/wiki/United_States bar:United_States link:http://www.wikipedia.org/wiki/United_States
Colors
Dieser Befehl erlaubt es, Farben zu definieren und an eine ID (identification tag) zu binden. Andere Befehle beziehen sich dann auf die in der ID definierte Farbe. Der Befehl erwartet eine oder mehrere Farbdefinitionen, die jeweils in einer eigenen Zeile stehen.
- id
- Andere Befehle verwenden diese ID um Text-, Balken- oder Hintergrundfarben zu spezifizieren.
- value
- Aktuelle Farbdefinition. Mögliche Werte sind:
- vordefinierte Farbkonstanten. Es werden 32 vordefinierte Farbnamen akzeptiert. (Siehe dazu die „Ploticus color page“, Beispiel unten)
- rgb (Rot-Wert, Grün-Wert, Blau-Wert): Drei Zahlen jeweils zwischen 0 (Minimum) und 1 (Maximum)
- hsv (Farbton, Sättigung, Wert): Drei Zahlen jeweils zwischen 0 (Minimum) und 1 (Maximum)
- gray (Grauton): Ein Wert zwischen Null (Schwarz) und 1 (Weiß)
- legend (O)
- Spezifiziert den Text, der in der Legende für diese Farbe auftauchen soll. Falls dieses Attribut weggelassen wird, taucht kein Eintrag in der Legende auf. Siehe Text Input für die Regeln.
Beispiel:
Colors = id:krieg value:red legend:Kriegszeiten id:frieden value:blue legend:Friedenszeiten id:vertrag value:rgb(0.6,0,0.6) id:hellgrau value:gray(0.9) id:dunkelgrau value:gray(0.1)
Farbnamen und RGB-Werte:
<timeline> ImageSize = width:900 height:400 PlotArea = left:30 bottom:30 top:0 right:20 DateFormat = x.y Period = from:0 till:6 TimeAxis = orientation:horizontal AlignBars = justify ScaleMajor = gridcolor:black increment:1 start:0 ScaleMinor = gridcolor:black increment:1 start:0
PlotData=
bar:1. width:50 align:center fontsize:m from:0 till:1 color:black text:"black #000000" textcolor:white from:1 till:2 color:tan1 text:"tan1 #E5D3C9" from:2 till:3 color:tan2 text:"tan2 #B29999"
- from:3 till:4 color:lightgray text:"lightgray #D8D8D8" # ploticus 2.4.2 kennt lightgray, WP nutzt anscheinend eine ältere Version?
from:4 till:5 color:white text:"white #FFFFFF"
bar:2. width:50 align:center fontsize:m from:0 till:1 color:red text:"red #FF0000" from:1 till:2 color:magenta text:"magenta #FF4C7F" from:2 till:3 color:claret text:"claret #B24C4C" textcolor:white from:3 till:4 color:coral text:"coral #FF9999" from:4 till:5 color:pink text:"pink #FFCCCC"
bar:3. width:50 align:center fontsize:m from:0 till:1 color:orange text:"orange #FF9E23" from:1 till:2 color:redorange text:"redorange #FF7F00" from:2 till:3 color:lightorange text:"lightorange #FFCC99"
bar:4. width:50 align:center fontsize:m from:0 till:1 color:yellow text:"yellow #FFFF00" from:1 till:2 color:yellow2 text:"yellow2 #EAEA00" from:2 till:3 color:dullyellow text:"dullyellow #FFE599" from:3 till:4 color:yelloworange text:"yelloworange #FFD800" from:5 till:6 color:limegreen text:"limegreen #CCFFB2"
bar:5. width:50 align:center fontsize:m from:0 till:1 color:brightgreen text:"brightgreen #00FF00" from:1 till:2 color:green text:"green #00B200" from:2 till:3 color:kelleygreen text:"kelleygreen #4C994C" textcolor:white from:3 till:4 color:teal text:"teal #007F33" textcolor:white from:4 till:5 color:drabgreen text:"drabgreen #99CC99" from:5 till:6 color:yellowgreen text:"yellowgreen #99E599"
bar:6. width:50 align:center fontsize:m from:0 till:1 color:brightblue text:"brightblue #0000FF" textcolor:white from:1 till:2 color:blue text:"blue #0066CC" textcolor:white from:2 till:3 color:darkblue text:"darkblue #000099" textcolor:white from:3 till:4 color:oceanblue text:"oceanblue #007FCC" from:4 till:5 color:skyblue text:"skyblue #B2CCFF"
bar:7. width:50 align:center fontsize:m from:0 till:1 color:purple text:"purple #770077" textcolor:white from:1 till:2 color:lavender text:"lavender #CCB2CC" from:2 till:3 color:lightpurple text:"lightpurple #AA4CAA" textcolor:white from:3 till:4 color:powderblue text:"powderblue #9999FF" from:4 till:5 color:powderblue2 text:"powderblue2 #B2B2FF"
</timeline>
DateFormat
Dieser Befehl definiert, in welchem Format Daten, die durch andere Befehle spezifiziert werden, interpretiert werden.
Erlaubte Formate sind:
- dd/mm/yyyy
- Daten werden als Tag/Monat/Jahr interpretiert
- Bemerkung: Dieses Format ist nur für Daten ab 01/01/1800 erlaubt
- mm/dd/yyyy
- Daten werden als Monat/Tag/Jahr interpretiert
- Bemerkung: Dieses Format ist nur für Daten ab 01/01/1800 erlaubt
- yyyy
- Hiermit sind Angaben zwischen -9999 und +9999 möglich
Beispiel:
DateFormat = mm/dd/yyyy
Define
Dieser Befehl ermöglicht das Definieren von Textkonstanten, d. h. Kurzformen für Skriptcode der mehrfach verwendet wird. Textkonstanten müssen immer mit einem $ (Dollarzeichen) beginnen.
Beispiel:
Define $broad = width:30 Define $narrow = width:10 Define $bardefaults = $broad fontsize:S
LineData
Einige Zeitleisten umfassen mehrere klar abgegrenzte Perioden. Als optische Hilfe können Trennlinien eingefügt werden.
- at
- Zeichnet eine Linie senkrecht zur Zeitachse (Standard über die maximale Länge, siehe auch das Beispiel).
Gebe das Datum/Jahr an, wo die Linie gezeichnet werden soll, unter Beachtung des DateFormat. - color
- Angabe der Linienfarbe.
- Bemerkung: Die Farb-Id sollte vorher mit dem Colors-Befehl angegeben werden.
- layer
- Gibt an front oder back (Standard). Bestimmt, ob die Linie entweder vor oder hinter den Zeitbalken gezeichnet werden soll.
- width
- ein Wert zwischen 0.1 (sehr dünn) und 10 (sehr dick)
Nur in wenigen Fällen werden die folgenden Attribute für die volle Flexibilität benötigt:
Fortgeschrittene Positionierungsoptionen
Man kann Linien in alle Richtungen zeichnen. Die folgenden Optionen sind möglich:
- Senkrecht zur Zeitachse mit beliebigem Start- und Endpunkt: at:date frompos:position tillpos:position
- Parallel zur Zeitachse mit beliebigem Start- und Endpunkt from:date till:date atpos:position
- In beliebiger Richtung mit beliebigem Start- und Endpunkt points:(x1,y1)(x2,y2)
Für die Attribute at, from und till gelten Datum oder Jahr, unter Beachtung des DateFormat.
Für die Attribute frompos, tillpos, atpos werden Koordinaten (z. B. Pixelwerte) erwartet.
Beispiel:
LineData =
layer:front # alle Linien vor den Balken, außer es ist anders angegeben
at:1 color:yellow # senkrecht zur Zeitachse in der ganzen Höhe
at:2 color:orange layer:back # senkrecht zur Zeitachse in der ganzen Höhe, aber hinter den Balken
at:4 frompos:50 tillpos:105 color:green
# senkrecht zur Zeitachse, mit definiertem Anfang- und Endpunkt
from:5 till:8 atpos:50 color:red
# parallel zur Zeitachse
points:(100,20)(170,105) color:blue width:3
# von einem bestimmten Punkt zu einem anderen, extradick
wird zu:
<timeline> ImageSize = width:200 height:120 PlotArea = left:20 right:10 top:10 bottom:20 TimeAxis = orientation:horizontal AlignBars = justify Colors =
id:gray1 value:gray(0.3) id:gray2 value:gray(0.5) id:gray3 value:gray(0.7)
Period = from:0 till:10 ScaleMajor = unit:year increment:1 start:0
PlotData =
bar:X color:gray1 width:15 from:start till:end bar:Y color:gray2 from:start till:end bar:Z color:gray3 from:start till:end
LineData =
layer:front at:1 color:yellow at:2 color:orange layer:back at:4 frompos:50 tillpos:105 color:green from:5 till:8 atpos:50 color:red points:(100,20)(170,105) color:blue width:3
</timeline>
ImageSize
Dieser Befehl definiert die Gesamtgröße der resultierenden Grafik.
Angabe in Absolutwerten.
- width
- Breite der Grafik, Maximum sind 1600 Pixel
- height
- Höhe der Grafik, Maximum sind 2000 Pixel
Beispiel:
ImageSize = width:800 height:600
Legend
Eine Legende wird nur angezeigt wenn dieser Befehl vorhanden ist. Es gibt verschiedene Möglichkeiten, die Darstellung und Position der Legende zu beeinflussen. Einige der Attribute schließen sich gegenseitig aus (siehe unten).
- orientation (O)
- Die Lage der Balken: hor[izontal] oder ver[tical] (voreingestellt).
- Einschränkung: orientation = 'horizontal' und position = 'right’ schließen sich gegenseitig aus
- position (O)
- Definiert die Platzierung der Legende relativ zur chart area. Angabe: top, bottom (default) oder right.
- Einschränkung: orientation = 'horizontal' und position = 'right’ schließen sich gegenseitig aus
- columns (O)
- Anzahl der Spalten 1, 2, 3 or 4. Wenn dieses Attribut fehlt wird die Anzahl der Spalten folgendermaßen ermittelt:
- bei Orientierung horizontal: Attribut 'columns’ ist nicht erlaubt, alle Einträge erscheinen in einer Zeile.
- bei Orientierung vertical:
- Position right: Alle Einträge kommen in eine Spalte
- Position top oder bottom: Die Anzahl der Spalten hängt von der Anzahl der Einträge ab:
1-5 Einträge: 1 Spalte, 6-10 Einträge: 2 Spalten, 11 oder mehr Einträge: 3 Spalten.
Tipp: Anfangs folgende Parameter weglassen und erst wenn das Ergebnis nicht zufriedenstellt benutzen.
- columnwidth (O)
- Definiert den Abstand zwischen Spalten. Angaben in absoluter Entfernung oder ein relativer Abstand (in Prozent der Grafikbreite).
- Einschränkung: dieses Parameter wird ignoriert wenn die Spaltenanzahl 1 ist.
- left (O)
- Definiert die Distanz zwischen der linken Seite der Legende und dem linken Rand der Grafik. (absolut oder relativ).
- top (O)
- Definiert die Distanz zwischen oberem Rand der Legend und dem unteren Rand der Grafik. (absolut oder relativ).
Beispiele:
Legend = orientation:vertical position:bottom columns:3 columnwidth:140 Legend = orientation:horizontal position:bottom Legend = left:100 top:120 columns:3
Period (unbedingt notwendig)
Definiert das Zeitintervall, das in der Grafik dargestellt wird. Beide Parameter sind erforderlich. Angabe in Übereinstimmung mit dem DateFormat.
- from
- Beginn der Zeitleiste.
- till
- Endzeitpunkt der Grafik.
Diese Werte werden an die Konstanten 'start’ bzw. 'end' übergeben, auf die bei Befehlen wie PlotData und TextData zurückgegriffen werden kann.
Beispiel:
Period = from:01/09/1939 till:02/09/1945
PlotArea (unbedingt notwendig)
Definiert den Bereich im Bild, der für den eigentlichen Plot verwendet wird. Die Ränder müssen so groß gewählt werden, dass eventuelle Achsenbeschriftungen noch ausreichend Platz haben.
- width
- Breite des Bereichs in absoluten oder relativen Maßen.
- height
- Höhe des Bereichs in absoluten or relativen Maßen.
- left
- Absolute oder relative Breite des linken Randes. Der rechte Rand ergibt sich aus der Bildbreite minus der Breite des Plotbereichs minus der Breite des Linken Randes.
- bottom
- Absolute oder relative Höhe des unteren Randes. Die Höhe des oberen Randes ergibt sich entsprechend.
Beispiele:
PlotArea = width:640 height:420 left:160 bottom:120 PlotArea = width:80% height:70% left:20% bottom:20%
PlotData
„PlotData“ wird verwendet um Balken zu definieren (welcher eine Zeitspanne darstellt) und fügt Text neben diesen Balken an eine definierte Position ein.
Für Texte welche nicht zu einer bestimmten Zeitspanne, einem Datum oder Jahr zugeordnet werden, oder einer umfangreichen Formatierung bedürfen verwende man den Befehl „TextData“
Die Attribute „text“, „at“, „from“ und „till“ gelten nur für die Zeile, in der sie verwendet werden. Alle anderen Attribute, sofern sie nicht mit diesen vier kombiniert werden, agieren als Standard für den Befehlsblock; solange bis ein neuer Standard definiert wird. Sie können für eine einzelne Zeile überschrieben werden und gelten nur für diese Zeile. Siehe „Parameters vs Data Items“ für mehr Informationen, sowie eines Beispiels.
(original: Attributes text, at, from and till always apply only to the line on which they occur. All other attributes, when not combined with one these four, act as default for the remainder of the command block or until a new default is specified, and may be overruled for a single line. See Parameters vs Data Items for more info and an example.)
PlotData akzeptiert eine Reihe von Attributen, von denen sich manche gegenseitig ausschließen. Diese können in folgende Gruppen eingeteilt werden:
Positionsattribute
- at
- Spezifiziert an welches Datum bzw. an welches Jahr ein Text geschrieben werden soll. Basierend auf dem Attribut „align“ wird der Text an dieser Position begonnen oder beendet oder an dieser Position zentriert. Bitte benutze das Format, welches unter „DateFormat“ beschrieben wird oder spezifiziere „start“ oder „end“, bezogen auf den Zeitrahmen, der durch den Befehl „Period“ definiert wurde.
- Anmerkung: Dieses Attribut kann nicht mit den Attributen „from“ or „till“ kombiniert werden.
- from
- Gibt an, an welchem Datum bzw. in welchem Jahr der Zeitbalken beginnen soll. Bitte benutze das Format, welches unter „DateFormat“ beschrieben wird oder spezifiziere „start“, bezogen auf den Zeitrahmen, der durch den Befehl „Period“ definiert wurde.
- Anmerkung: Dieses Attribut kann nicht mit dem Attribut „at“ kombiniert werden und sollte mit dem Attribut „till“ verwendet werden.
- till
- Gibt das Ende des Zeitbalkens an. Bitte benutze das Format, welches unter „DateFormat“ beschrieben wird oder spezifiziere „end“, bezogen auf den Zeitrahmen, der durch den Befehl „Period“ definiert wurde.
- Anmerkung: Dieses Attribut kann nicht mit dem Attribut „at“ kombiniert werden und sollte mit dem Attribut „from“ verwendet werden.
- shift
- Gibt den horizontalen und vertikalen Versatz in absoluten Masseinheiten („measurements“) an. Dies erlaubt folgendes:
- Text kann versetzt werden um Überlappungen zu vermeiden
- Positionierung von Text neben einen Balken, statt darüber.
Beispiele:
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:"<-- 2WK erreicht Asien"
Balkenattribute
- bar
- Spezifiziert, zu welchem Balken die folgenden Attribute gehören.
- Wenn das Kommando BarData nicht verwendet wurde, so werden die Balken in der Reihenfolge gezeichnet, in der sie im PlotData-Datenblock auftauchen. Die hier angegebene ID wird auch als Achsenbeschriftung neben dem Balken verwendet.
- Wenn BarData verwendet wird, werden die Balken in der Reihenfolge gezeichnet, wie sie dort angegeben werden. Auch die hier angegebene Balken-ID wird gegen die IDs in der Liste abgeglichen. Der Text, der auf den Achsen erscheint, ist abhängig von den Angaben im BarData-Abschnitt.
- barset
- Startet eine Balkenanzeige, die mehrere Balken in derselben Zeile erlaubt. Syntax:
barset:name - Leerzeilen können eingefügt werden, um Zeilen zu überspringen, mit
barset:skip. barset:breakstartet die Balkenanzeige von vorne. Siehe auch dieses kompliziertes Beispiel- color
- Gibt die Farbe an, in der der Balken gezeichnet werden soll.
- Die angegebene Farb-ID sollte zuvor mit dem Kommando Colors angegeben worden sein.
- width
- Gibt die absolute oder relative Breite des Balkens an.
Beispiel:
BarData= bar:US text:Vereinigte Staaten bar:SB text:Seeschlachten Colors= id:US value:blue legend:Vereinigte_Staaten id:SB value:rgb(0.8,0,0.7) legend:Seeschlachten PlotData= width=0.3 # siehe Anmerkung 1 bar:SB from:07/08/1942 till:09/02/1943 text:Guadalcanal color:SB # siehe Anmerkung 2 bar:US from:start till:end color:US # siehe Anmerkung 3 bar:Midway from:start till:end color:US # siehe Anmerkung 4 bar:US at:07/12/1941 text:7/12 Pearl Harbor # siehe Anmerkung 5
Anmerkungen:
- diese Zeile erzeugt eine Standardbalkenweite für den Rest des Datenblocks
- diese Zeile gibt einen zu zeichnenden Balken an, sowie Text, der auf den Balken ausgegeben werden soll
- der 'US'-Balken wird vor dem 'SB'-Balken gezeichnet, da BarData die Reihenfolge bestimmt
- der Midway-Balken wird verworfen, da er nicht im BarData-Teil deklariert wurde
- die letzte Zeile gibt keinen Balken aus, sondern gibt lediglich den Balken an, auf dem der Text platziert werden soll
Textattribute
- text
- Definiert einen Text der auf oder neben den Balken gezeichnet werden soll. Die Ankerposition kann explizit über das Attribut at oder implizit über die Attribute from und till angegeben werden. Bei impliziter Angabe wird der Text mittig innerhalb des definierten Balkens dargestellt. Siehe auch Text Input für die Regeln.
- Der Text darf Links beinhalten (siehe Anmerkungen 1 und 2). Diese werden in klickbaren Karten verwendet.
- textcolor (O)
- Definiert die Farbe des Textes. Die Farb ID sollte zuerst mit dem Befehl Colors festgelegt werden. Wenn keine Farbe bestimmt wurde, wird schwarz angenommen.
- fontsize (O)
- Eine Punktgröße zwischen 6 und 30, oder (vorzugsweise) eines der Attribute XS, S (Standard), M, L or XL. Siehe Font Support für weitere Informationen.
- align (O)
- Mögliche Ausrichtung center (Standard), left oder right.
- link (O)
- Ein Weblink (siehe Ergänzung 1) (URL) für den Gebrauch von anklickbaren Karten. Der Text wird als blauer anklickbarer Link angezeigt.
Ergänzungen
- Verwende entweder das Attribut link, oder einen eingebetteten Link in dem Attribut text, nicht beide.
- In PNG Bildern wird nur ein anklickbarer Link pro Textsegment (ein Text mit Zeilenvorschub (~) erzeugt mehrere Segmente) angezeigt.
Beispiel:
PlotData= bar:US at:07/12/1941 align:left textcolor:black fontsize:XS text:7/12 [[Pearl Harbor]]
ergibt dasselbe Ergebnis wie:
PlotData= bar:US at:07/12/1941 align:left textcolor:black fontsize:XS text:"7/12 Pearl Harbor" link:http://de.wikipedia.org/wiki/Pearl_Harbor
Markierungen
- mark
- Platziert eine Markierung in einem Balken an der angegebenen Position. Die Markierung wird mit dem Schlüsselwort mark:(Symbol, Farbkennung) angegeben. Bisher ist für Symbol nur der Wert line gestattet. Die Farbkennung muss zuvor mit dem Colors-Kommando definiert werden. Wird keine Farbe angegeben, erscheint die Linie schwarz.
Beispiel:
PlotData= width:15 color:red bar:test from:1900 till:2000 bar:test at:1990 mark:(line,white)
Darstellung: <timeline> ImageSize = width:140 height:60 PlotArea = width:100 height:30 left:20 bottom:30 TimeAxis = orientation:horizontal DateFormat = yyyy Period = from:1900 till:2000 AlignBars = early ScaleMajor = unit:year increment:50 start:1900 Colors =
id:canvas value:rgb(1,1,0.85)
BackgroundColors = canvas:canvas PlotData =
width:15 color:red bar:test from:1900 till:2000 bar:test at:1990 mark:(line,white)
</timeline>
ScaleMajor
Definiert die Unterteilung der Zeitachse
- grafisch durch dünne vertikale oder horizontale Linien,
- textlich durch Beschriftungen an der Zeitachse unterhalb oder links der Darstellung,
- grafisch und textlich.
Anmerkung: Die Orientierung der Linien und/oder die Platzierung der Beschriftung hängt von der Orientierung der Zeitachse ab.
- gridcolor (O)
- Definiert die Farbe der Achsenteilstriche. Fehlt diese Angabe, werden keine Striche gezeichnet.
- Anmerkung: Die Farbe (ID) muss vorher mit dem Colors-Kommando definiert werden.
- unit (O)
- Definiert die Einheit der Achseneinteilung als Tage (day), Monate (month) oder Jahre (year, Voreinstellung).
- Anmerkung: Falls bei DateFormat yyyy angegeben wurde, ist nur die Einheit year gestattet.
- increment (O)
- Definiert die Schrittweite der Achseneinteilung in der eingestellten Einheit. Voreingestellt ist die Schrittweite 1.
- start (O)
- Definiert den Ort des ersten Achsenteilstriches und/oder der ersten Beschriftung. Voreingestellt ist der Anfang der definierten Periode (period).
Examples:
ScaleMajor = gridcolor:red start:1940 ScaleMajor = gridcolor:red unit:month increment:3 start:01/09/1939
ScaleMinor
Definiert eine feinere Unterteilung der Zeitachse. Siehe auch ScaleMajor.
Beispiel:
ScaleMajor = grid:red unit:year increment:1 start:01/01/1940 ScaleMinor = grid:blue unit:month increment:3 start:01/10/1939
TextData
Wird benützt, um einen Textblock zu definieren, der überall im Diagramm positioniert werden kann.
- text
- Der aktuelle Text. Für die Befehle siehe auch Text Input. Der Text kann auch eingebettete Links enthalten (siehe Notes 1 & 2).
- pos
- Definiert die linke obere Ecke des Textblocks in absoluten oder relativen Angaben measurements. Definiere als pos:(x,y).
- link (O)
- Beschreibt einen Weblink (siehe Note 1) (URL) für die Verwendung in anklickbaren Karten. Die Anzeige entlang der Achsen wird blau als anklickbarer Link angezeigt.
- textcolor (O)
- Definiert die Farbe des Textes. Die angegebene Farb-ID sollte zuerst definiert werden, siehe Colors. Wenn sie nicht angegeben wird, dann wird die Farbe automatisch schwarz ausgewählt.
- fontsize (O)
- Gibt die Punktgröße zwischen 6 und 30 an, oder (vorzugsweise) eines der Tags XS, S (Standard), M, L oder XL (siehe Font Support für weitere Details).
- tabs (O)
- Definiert die Position und die Ausrichtung des TAB-Zeichens: ^ (caret). Mehrfache TABs können gesetzt werden: (x1-a1,x2-a2,x3-a3, etc..) wobei
- xn die horizontale Verschiebung in absoluten Maßen von der linken Textseite aus bedeutet
- an die Ausrichtung des Textteils bedeutet (speziell center, left oder right)
- lineheight (O)
- Definiert den Abstand zwischen aufeinanderfolgenden Linien in absoluten Maßen. Es darf ein Wert bis zu 40 Pixel oder 0,4 inch verwendet werden. Wenn kein Wert für "Lineheight" eingetragen wurde, dann leitet er sich aus der verwendeten Fontgröße ab.
Notes:
- Verwende das Attribut link, oder einen eingebetteten Link im Attribut text, nicht beide.
- In PNG Bildern wird nur ein anklickbarer Link pro Textsegment angezeigt (Text mit TABs (^) erzeugt mehrere Segmente).
Beispiel:
TextData = pos:(20,67) textcolor:black fontsize:S tabs:(10-right,14-left,50-left,90-left,230-left) text:^1^1940^27/9^Germany,Italy and Japan sign [[Tripartite Pact]] text:^10^1944^1-22/7^Bretton Woods 44 nations establish text:^^^^^IMF and World Bank
wird angezeigt als:
<timeline> ImageSize = width:400 height:70 PlotArea = width:400 height:70 left:0 bottom:0 TimeAxis = orientation:vertical # dummy, required Period = from:0 till:1 # dummy, required Colors =
id:canvas value:rgb(1,1,0.85)
BackgroundColors = canvas:canvas TextData =
pos:(20,67) textcolor:black fontsize:S tabs:(10-right,14-left,50-left,90-left,230-left) text:^1^1940^27/9^Germany,Italy and Japan sign Tripartite Pact text:^10^1944^1-22/7^Bretton Woods 44 nations establish text:^^^^^IMF and World Bank
</timeline>
TimeAxis
Definiert die Orientierung der Zeit-Achse und das Format der Einteilung entlang dieser Achse.
- format (O)
- Spezifiziert in welchem Format die Daten entlang der Achse dargestellt werden sollen.
- Zurzeit wird nur das Format yyyy (Standard) unterstützt. Andere Formate könnten folgen.
- orientation (O)
- Spezifiziert hor[izontal] (Standard) oder ver[tical].
Example:
TimeAxis = orientation:horizontal format:yyyy
Input rules
Measurements
Absolute Maße können benutzt werden, um die Größe, Position und Lageveränderungen zu definieren. Die Maße werden in Pixel angegeben.
Beispiel:
PlotArea = width:800 height:600 left:50 bottom:50
Relative Maße können für die Definition der Größe und der Lage benutzt werden. Es muss eine Zahl zwischen 0 und 100, unmittelbar gefolgt vom % (Prozent-) Zeichen, angegeben werden. Das horizontale Maß bezieht sich die Prozentangabe der Breite des Bildes, das vertikale Maß bezieht sich auf die Höhe des Bildes.
Beispiel:
PlotArea = width:80% height:80% left:10% bottom:5%
Text Input
Bei der Texteingabe müssen einige Regeln beachtet werden:
1 Bis jetzt ist kein "Unicode" erlaubt. Siehe auch font support.
2 Wenn der Text Leerzeichen enthalten soll, dann sollten diese mit Unterstrich (_) oder es sollte der Text in Anführungszeichen gesetzt werden.
- Ausnahme: Wenn das Text Attribut das letzte Attribut in einer Zeile ist, sind Leerzeichen erlaubt (es gibt kein Durcheinander wo der Text endet und das nächste Attribut beginnt, das gilt, um genau zu sein, wenn keine Doppelpunkte im Text vorkommen).
Beispiel: (die folgenden Ausdrücke sind gleichbedeutend)
BarData = text:Japanese_mandate_since_1914 bar:Marshalls BarData = text:"Japanese mandate since 1914" bar:Marshalls BarData = bar:Marshalls text:Japanese mandate since 1914
3 In Datenzeilen, wie TextData hat ein Buchstabe eine besondere Bedeutung:
- ^ (caret) bedeutet Tabulator
- (Ergänzung: ~ (tilde) gilt als Buchstabe!)
Beispiel mit Tabulator:
TextData = tabs:(4-right,12-right,14-left,34-left) text:^1^1940^27/9^Berlin Ger,It,Jap sign Tripartite Pact text:^10^1944^1-22/7^Bretton Woods 44 nations establish text:^^^^^IMF and World Bank
wird angezeigt als:
<timeline> ImageSize = width:400 height:70 PlotArea = width:400 height:70 left:0 bottom:0 TimeAxis = orientation:vertical # dummy, required Period = from:0 till:1 # dummy, required Colors =
id:canvas value:rgb(1,1,0.85)
BackgroundColors = canvas:canvas TextData =
pos:(20,67) textcolor:black fontsize:S tabs:(10-right,14-left,50-left,90-left,230-left) text:^1^1940^27/9^Germany,Italy and Japan sign Tripartite Pact text:^10^1944^1-22/7^Bretton Woods 44 nations establish text:^^^^^IMF and World Bank
</timeline>
Clickable Maps
Beide Ausgabeformate, die in der Wikipedia verwendet werden PNG und SVG können anklickbare Links enthalten. Texte, die in blau dargestellt werden und Balken führen dann, wenn sie angeklickt werden, zu einer anderen Webseite.
Links können mit den Befehlen definiert werden: BarData, PlotData und TextData, oder mit dem Attribut link, oder als eingebetteter Link mit dem Attribut text.
Eingebettete Links
Eingebettete Links sind Links, die (Teil eines) angezeigten Textes sind, definiert mit dem Attribut text. Das Gegenstück dazu sind explizite Links (nur URL), die mit dem Attribut link definiert werden.
Beide Linkarten können mit den Befehlen definiert werden: BarData, PlotData und TextData und werden für clickable maps verwendet.
Text zwischen 2 eckigen Klammern definieren einen Link zu einem Wikipediaartikel. Ein Artikel in irgendeiner Wikipedia kann durch den Zusatz vor dem Artikelnamen von 2 oder 3 Buchstaben Code für diese Wikipedia. Irgendein Text, der nach dem | (pipe) Symbol wird statt dem aktuellen Artikelnamen angezeigt
Ein Weblink (URL) kann zwischen einfachen eckigen Klammern definiert werden. Genauso wie vorher, wird der Text nach dem | (pipe) Symbol statt dem Weblink angezeigt.
Beispiele:
text:1642 [[Rembrandt]] paints Night Watch
wird angezeigt als: <timeline> ImageSize = width:230 height:25 PlotArea = left:0 right:0 bottom:0 top:0 TimeAxis = orientation:vertical # dummy, required Period = from:0 till:1 # dummy, required Colors =
id:canvas value:rgb(1,1,0.85)
BackgroundColors = canvas:canvas TextData =
pos:(10,10) fontsize:S text:"1642 Rembrandt paints Night Watch"
</timeline>
besser alles in den Link schreiben: <timeline> ImageSize = width:230 height:25 PlotArea = left:0 right:0 bottom:0 top:0 TimeAxis = orientation:vertical # dummy, required Period = from:0 till:1 # dummy, required Colors =
id:canvas value:rgb(1,1,0.85)
BackgroundColors = canvas:canvas TextData =
pos:(10,10) fontsize:S text:1642 Rembrandt paints Night Watch
</timeline>
text:1642 [[Rembrandt|Rembrandt van Rijn]] paints Night Watch
wird angezeigt als: <timeline> ImageSize = width:280 height:25 PlotArea = left:0 right:0 bottom:0 top:0 TimeAxis = orientation:vertical # dummy, required Period = from:0 till:1 # dummy, required Colors =
id:canvas value:rgb(1,1,0.85)
BackgroundColors = canvas:canvas TextData =
pos:(10,10) fontsize:S text:"1642 Rembrandt van Rijn paints Night Watch"
</timeline>
text:1642 [http://www.wikipedia.org/wiki/Rembrandt|Rembrandt van Rijn] paints Night Watch
wird angezeigt als: <timeline> ImageSize = width:280 height:25 PlotArea = left:0 right:0 bottom:0 top:0 TimeAxis = orientation:vertical # dummy, required Period = from:0 till:1 # dummy, required Colors =
id:canvas value:rgb(1,1,0.85)
BackgroundColors = canvas:canvas TextData =
pos:(10,10) fontsize:S text:"1642 van Rijn paints Night Watch"
</timeline>
Der folgende Link zeigt zum Artikel von Rembrandt: nl:Rembrandt
text:1642 [[nl:Rembrandt|Rembrandt van Rijn]] paints Night Watch
wird angezeigt als: <timeline> ImageSize = width:280 height:25 PlotArea = left:0 right:0 bottom:0 top:0 TimeAxis = orientation:vertical # dummy, required Period = from:0 till:1 # dummy, required Colors =
id:canvas value:rgb(1,1,0.85)
BackgroundColors = canvas:canvas TextData =
pos:(10,10) fontsize:S text:"1642 paints Night Watch"
</timeline>
Beachte, dass die letzten beiden Links zu verschiedenen Wikipedias führen. Der Popuptext ist auch verschieden (bewege den Cursor über den Link).
Anmerkung: Im Link sind keiner Anker möglich weil # als Kommentar interpretiert wird.
Font Support
Timeline hat eine begrenzte Unicodeunterstützung. Es benutzt den FreeSans.ttf Font, der eine Untermenge der möglichen Zeichen unterstützt (der Font beinhaltet: Kyrillisches Alphabet, Osteuropäische Darstellung und Kana, aber es fehlt Kanji). Es sind zurzeit keine anderen Fonts zugänglich.
<timeline> ImageSize = width:180 height:90 PlotArea = width:180 height:90 left:0 bottom:0 TimeAxis = orientation:vertical #dummy Colors =
id:gray value:gray(0.95)
Backgroundcolors = canvas:gray Period = from:1 till:2 # dummy TextData=
pos:(10,90) fontsize:L text:"维基百科" pos:(10,70) fontsize:L text:"Zażółć gęślą jaźń" pos:(10,50) fontsize:L text:"ウィキペディア"
</timeline>
Schriften
Unicode ist (noch) nicht erlaubt. Der Schrifttyp kann (noch) nicht festgelegt werden.
Fünf Schriftgrößen sind vordefiniert, die in leicht unterschiedlicher Größe in PNG- und SVG-Bildern dargestellt werden, um optimale Lesbarkeit auf beiden Plattformen zu erreichen. Es wird empfohlen woimmer möglich diese tags statt numerischer Angaben zu benutzen.
Es sind: XS=eXtra Small, S=Small (default), M=Medium, L=Large, XL=eXtra large
<timeline> ImageSize = width:170 height:90 PlotArea = width:170 height:90 left:0 bottom:0 TimeAxis = orientation:vertical #dummy Colors =
id:grau value:gray(0.95)
Backgroundcolors = canvas:grau Period = from:1 till:2 # dummy TextData =
pos:(30,70) fontsize:XS text:"Schriftgröße:XS" pos:(25,58) fontsize:S text:"Schriftgröße:S" pos:(20,41) fontsize:M text:"Schriftgröße:M" pos:(15,25) fontsize:L text:"Schriftgröße:L" pos:(10,7) fontsize:XL text:"Schriftgröße:XL"
</timeline>
Zusammenfassung
auch Vorlage für weitere Entwicklungen:
Balken vertikal
# * heißt unbedingt nötig!
ImageSize = width:550 height:120 # * Größe des Bildes
PlotArea = width:450 height:80 left:50 bottom:20 # Plotgröße für Timeline
AlignBars = late # Ausrichtung rechts
DateFormat = yyyy # * yyyy oder dd/mm/yyyy
Period = from:0 till:20000 # * von .. bis ..
TimeAxis = orientation:vertical # * Orientierung der Achse
ScaleMajor = unit:year increment:5000 start:0 # * Skalierung (je 5000), Start bei 0
gridcolor:drabgreen # Gitterfarbe
PlotData=
color:blue width:15 # Farbe blau, Breite 15
bar:1953 from:start till:12400 # Daten für die Balken
bar:1955 from:start till:15157
bar:1958 from:start till:19629
TextData=
pos:(20,110) fontsize:M text: Überschrift # Position und Text für den Titel
<timeline> ImageSize = width:350 height:120 PlotArea = width:250 height:80 left:50 bottom:20 AlignBars = late
DateFormat = yyyy Period = from:0 till:20000 TimeAxis = orientation:vertical ScaleMajor = unit:year increment:5000 start:0 gridcolor:drabgreen
PlotData=
color:blue width:15 bar:1953 from:start till:12400 bar:1955 from:start till:15157 bar:1958 from:start till:19629
TextData=
pos:(20,110) fontsize:M text: Überschrift
</timeline>
Horizontaler Balken
# * bedeutet unbedingt nötig ImageSize = width:275 height:50 # * Größe des Gesamtbildes PlotArea = left:30 right:30 top:0 bottom:20 # * Plotfläche für Timeline durch Ränder definiert DateFormat = x.y # Datenformat Period = from:0 till:100 # von .. bis .. TimeAxis = orientation:horizontal # Zeitachse horizontal ScaleMajor = unit:year increment:20 start:0 # Grobskalierung 20 ScaleMinor = unit:year increment:2 start:0 # Feinskalierung 2 Colors = # Umsetzung von gray in RGB id:grau value:gray(0.8) PlotData = # Daten für den Balken in verschiedenen Farben from:100.0 till:96.2 color:claret from:96.2 till:76.4 color:purple from:76.4 till:42.3 color:green from:42.3 till:0.0 color:red TextData = # Prozentzeichen pos:(5,5) text:%
<timeline> ImageSize = width:275 height:50 PlotArea = left:30 right:30 top:0 bottom:20 DateFormat = x.y Period = from:0 till:100 TimeAxis = orientation:horizontal ScaleMajor = unit:year increment:20 start:0 ScaleMinor = unit:year increment:2 start:0
Colors =
id:grau value:gray(0.8)
PlotData =
from:100.0 till:96.2 color:claret from:96.2 till:76.4 color:purple from:76.4 till:42.3 color:green from:42.3 till:0.0 color:red
TextData =
pos:(5,5) text:%
</timeline>
Mehrere horizontale Balken
ImageSize = width:800 height:auto barincrement:25 PlotArea = left:10 right:10 top:10 bottom:30 AlignBars = justify TimeAxis = orientation:horizontal format:yyyy Colors = id:canvas value:rgb(0.97,0.97,0.97) BackgroundColors = canvas:canvas Period = from:0 till:1400 ScaleMajor = unit:year increment:100 start:0 gridcolor:drabgreen BarData= barset:Flüsse PlotData= width:20 fontsize:M textcolor:black align:left color:skyblue shift:(0,-6) barset:Flüsse from:start till:end width:20 color:drabgreen Text:Flüsse_in_Hessen fontsize:10 align:center from:start till:end width:20 color:canvas fontsize:2 align:center from:start till:1320 text:Rhein (1.320 km) from:start till:218 text:Fulda (218 km) from:start till:97 text:[[Schwalm|Schwalm]] (97 km)
<timeline> ImageSize = width:800 height:auto barincrement:25 PlotArea = left:10 right:10 top:10 bottom:30 AlignBars = justify TimeAxis = orientation:horizontal format:yyyy
Colors =
id:canvas value:rgb(0.97,0.97,0.97)
BackgroundColors = canvas:canvas
Period = from:0 till:1400 ScaleMajor = unit:year increment:100 start:0 gridcolor:drabgreen
BarData=
barset:Flüsse
PlotData=
width:20 fontsize:M textcolor:black align:left color:skyblue shift:(0,-6)
barset:Flüsse
from:start till:end width:20 color:drabgreen Text:Flüsse_in_Hessen fontsize:10 align:center from:start till:end width:20 color:canvas fontsize:2 align:center
from:start till:1320 text:Rhein (1.320 km) from:start till:218 text:Fulda (218 km) from:start till:97 text:Schwalm (97 km)
</timeline>
Tipps und Tricks
SVG-Datei erstellen
Die Timeline-Erweiterung erzeugt im Hintergrund immer auch eine SVG-Datei. Um an diese zu kommen, kopiere den Link auf die Grafikdatei und ändere die Endung von PNG auf SVG.
Dies ist zum Beispiel dann nützlich, wenn die Grafik außerhalb von Wikipedia benutzt oder eingefroren werden soll.
Das direkte Hochladen solcher SVG-Dateien ist aber nicht zu empfehlen, da die Dateien von den Wikimedia-Servern nicht korrekt angezeigt werden. Zum Nachbearbeiten eignet sich z. B. Inkscape.
Beispiele bzw. bestehende Vorlagen
siehe Kategorie:Vorlage:Zeitleiste
Wartung
Es gibt seit Ende Juni 2018 eine versteckte Kategorie, in die vom System alle Seiten mit Zeitleisten eingeordnet werden können.
- Der Name der Kategorie wird über MediaWiki:Timeline-tracking-category wirksam festgelegt.
- Zurzeit ist dies deaktiviert.
- Im Zuge einer flächendeckenden Umstellung kann das aktiviert werden und damit würden ausnahmslos alle noch verwendenden Seiten aufgespürt.
- Es sind knapp 4000 Artikel betroffen, zuzüglich weiterer Projekt- und Benutzerseiten.
Weitere Informationen
- Hilfe:Graph – seit Mai 2015 verfügbare Nachfolgelösung.
