Modèle:Graphical timeline/Documentation

Description

Ce modèle est conçu pour ajouter des frises chronologiques dans les articles. Il exige un minimum de variables et s'inscrit dans un tableau.

Méthode facile

Inscrire {{include timeline}} dans la page, cliquez « prévisualiser » puis suivre les liens générés. Vous verrez un modèle prêt à utiliser. Quand il est rempli, retournez à la page de départ, où {{include timeline}} affiche la chronologie.

Pourquoi utiliser ce modèle ?

L'alternative est EasyTimeline, qui applique les balises <template>. EasyTimeline présente cependant des inconvénients :

• image pixellisée, qui change selon le navigateur et prend plus de temps à charger ;
• temps de création élevé, pouvant atteindre plus de 30 minutes, même lorsque vous maîtrisez la syntaxe ;
• code incompréhensible qui exige une syntaxe rigoureuse ;
• difficulté à inscrire les barres à l'endroit où vous le souhaitez ;
• modifier les minima de tailles et de dates exige de modifier plusieurs parties du modèle ;
• tous les paramètres doivent être indiqués ;
• ne rapetisse pas ni ne s'agrandit lorsque l'internaute demande un changement de taille.

Utilisation

Quand l'utiliser

Même si de courtes chronologies peuvent être inscrites dans un article, des contributeurs se plaignent que de longues chronologies brisent le rendu des pages, rendant leur modification difficile et aléatoire. Nous vous suggérons d'inscrire (tl) dans une page distincte, que vous pourrez insérer comme modèle dans une autre page.

Pour commencer

Vous pouvez insérer le paramètre |help=on dans le modèle pour voir quelques informations utiles.
Les premières fois, vous pourriez inscrire {{Graphical timeline|help=on}} dans le but de créer un modèle vide, prêt à utiliser. Vous pouvez aussi inscrire {{subst:Graphical timeline/blank}} dans une page brouillon, l'enregistrer puis modifier le code généré. Les noms de paramètres devraient donner suffisamment d'indice.

Signification des nombres

Les nombres sont, par défaut, exprimés en em, approximativement la hauteur et la largeur de la lettre « M ».

Les exceptions à cette règle portent sur les paramètres droit et gauche d'une barre, qui supportent des coordonnées décimales. Par exemple, le code |bar1-left=0 |bar1-right=0.5 |bar2-left=0.666 |bar3-left=0.5 |bar3-right=0.666 produira une barre 1 qui couvrira la moitié gauche de l'aire, une barre 2 qui couvrira les deux tiers les plus à gauche et la barre 3 occupera la place entre les deux premières barres. Par ailleurs, pour des raisons techniques, les unités de hauteur sont toujours utilisées pour calculer les largeurs de bordure.

Bordures des barres

Les bordures apparaissent seulement en haut ou en bas d'une barre. Cela ne peut être changé. Pour une bordure seulement en haut ou en bas, ajoutez une barre pour recouvrir la partie à « masquer ».

Le style des bordures respecte CSS : solid, dotted, dashed, double, groove, ridge, inset ou outset. La largeur est mesurée dans les mêmes unités que la hauteur ; si aucune n'est indiquée, de 0.1 à 0.2 est acceptable.

Lignes vides

Un paramètre vide indique d'utiliser la valeur par défaut. Pour générer une ligne vide, il faut l'indiquer.^[Comment ?]

Périodes géologiques

Pour dessiner une période géologique, inscrire |period3=Cénozoïque, avec |period3-left=0.1. Le modèle calculera alors le début, la fin et les bonnes couleurs. Par exemple, voyez en:Template:Cenozoic graphical timeline

Notes

Navigateurs

Les navigateurs web traitent différemment les lignes qui débordent de leur contenants. Quelques-uns étirent le contenant, alors que d'autres font un retour à la ligne. C'est donc une bonne pratique que d'analyser le fruit de votre travail dans IE et Firefox, surtout si votre chronologie est complexe.

Couleurs

Si vous inscrivez des couleurs à l'aide de codes HTML, tel que #e0b539, pensez que des écrans d'un certain âge et que des projecteurs sont incapables d'afficher toutes les couleurs qu'HTML autorise. Il est donc préférable de se cantonner aux couleurs garanties sur le web pour assurer la meilleure expérience du lecteur.

Limites

Si des barres chargées en nombres, notes ou légendes ne s'affichent pas, c'est que le modèle n'a pas été conçu pour une telle charge. Le code du modèle comprend des instructions pour repousser ces limites, ce que vous pouvez faire vous-même (souvent, un travail de copier-coller).

Modification

Si vous créez une chronologie dans une sous-page ou une page dédiée, utilisez le paramètre | link-to= . En indiquant le titre de la page (exemple, Modèle:Ma Chronologie), les liens « edit » et « history » apparaîtront.

Paramètres

La liste des paramètres est longue, mais vous n'utiliserez la plupart du temps que quelques paramètres. Les autres augmentent les possibilités du modèle !

Remplacez toute occurence de # par un nombre.

Paramètres généraux

Paramètres de la chronologie

Paramètre	Fonction	Obligatoire
from	Début temporel de la chronologie (peut être négatif)	Oui
to	Fin temporelle de la chronologie (peut être négatif)	Oui
width	Largeur de la chronologie	Non
title	Texte de la barre de titre	Non
title-colour	Couleur d'arrière-plan de la barre de titre	Non
instance-id	ID unique pour prévenir les collisions logicielles avec d'autres chronologies	Non

Périodes géologiques

Paramètres de période

Paramètre	Fonction
period#	Indique le nom de la période ; le modèle s'occupera du début et de la fin, et la colorera correctement.

Barres

Paramètres de la barre

Paramètre	Fonction
width	largeur de la chronologie

Légende

Paramètres de la légende

Paramètre	Fonction
width	Largeur de la chronologie

Notes

Paramètre de la note

Paramètre	Fonction
width	Largeur de la chronologie

Exemple

Le code à gauche produit la chronologie à droite, qui montre les limites du modèle. Pour un exemple pertinent, voyez en:Template:Ediacaran biota timeline.

Exemple

-550 —

–

-540 —

–

-530 —

–

-520 —

–

-510 —

–

-500 —

 

 

 

Édiacarien

Nemakit-Daldynien

Tommotien

 

Atdabanien

Botomien

Toyonien

 

←

Base du Cambrien

Cambrien moyen

 Phanérozoïque

 Précambrien

 Infracambrien

 Explosion cambrienne

Une échelle approximative des évènements
depuis le début de la période du Cambrien.
Axes en millions d'années.

{{Graphical timeline

|title=Exemple de chronologie
|align=right

|plot-colour=#bbeebb

|from=-550
|to=-500
|scale-increment=10

|width=10
|height=250
|height-unit=px

|legend1=[[Phanérozoïque]]

|bar1-from=-542
|bar1-left=0
|bar1-right=0.1

|legend2=[[Précambrien]]

|bar2-to=-542
|bar2-left=0
|bar2-right=0.2


|legend3=[[Infracambrien]]
|legend3-colour=#e0aacc

|bar3-to=-534
|bar3-left=0.1
|bar3-right=0.2
|bar3-colour=#e0aacc

|<!-- Si c'était la barre 4, elle serait recouverte par la barre du Botomien -->
|bar14-from=-530
|bar14-to=-520
|bar14-left=0.95
|bar14-right=1.05
|bar14-colour=red
|legend14=[[Explosion cambrienne]]

|<!--Epochs & stages-->
|bar5-text=[[Édiacarien]]
|bar5-to=-540
|bar5-left=0.2
|bar5-border-width=1
|bar5-border-colour= #996666
|bar5-colour=#cc9999

|bar6-text=[[Terreneuvien|Nemakit-Daldynien]]
|bar6-from=-542
|bar6-to=-534
|bar6-left=0.2
|bar6-border-width=0.1
|bar6-colour=#99cc99

|bar7-text=[[Étage 2 (époque)|Tommotien]]
|bar7-from=-534
|bar7-to=-530
|bar7-left=0.1
|bar7-colour=#99cc99
|bar7-border-width=0.1

|bar8-from=-530.1
|bar8-to=-529.9
|bar8-left=0.2
|bar8-colour=black

|bar9-text=[[Étage 3 (époque)|Atdabanien]]
|bar9-from=-530
|bar9-to=-524
|bar9-left=0.1
|bar9-right=0.95
|bar9-colour=#99cc99

|bar10-text=[[Étage 4 (époque)|Botomien]]
|bar10-from=-524
|bar10-to=-518
|bar10-left=0.1
|bar10-colour=#99cc99
|bar10-border-width=0.1

|bar11-text=[[Étage 4 (époque)|Toyonien]]
|bar11-from=-518
|bar11-to=-513
|bar11-left=0.1
|bar11-border-width=0.1
|bar11-colour=#99cc99


|note1=Base du Cambrien
|note1-at=-542
|note1-colour=green

|note2=[[Cambrien moyen]]
|note2-nudge-left=8.5
|note2-nudge-down=0
|note2-at=-507
|note2-remove-arrow=yes

|caption=Une échelle approximative des évènements<br>depuis le début de la période du [[Cambrien]].
<br>Axes en millions d'années.
}}

Commentaires sur l'exemple

• Utilisez {{!}} lorsque vous souhaitez insérer | (par exemple dans les légendes).
• Si vous n'indiquez pas le début ou la fin d'une barre, elle se prolongera jusqu'au bord de la chronologie.
• Le texte doit être court, de crainte qu'il ne déborde des cadres de la chronologie.
• Les navigateurs Web gèrent différemment le débordement de texte. Si le texte est long, insérez un retour de ligne (<br>) plutôt que de vous fier aux navigateurs. Ou encore, inscrivez une note au-dessus de la barre (voyez la note2, qui se trouve à la gauche et au-dessus du fond).

Utilisation et paramètres

Description du rôle de ce modèle à compléter. Insérez le code Templatedata dans cette section

Avec le wikicode

Avec l’éditeur visuel

Cliquez sur « Modifiez le code » et insérez la syntaxe suivante {{Graphical timeline|paramètre1|nom1param=valeur1}}

Cliquez sur modifier. L'éditeur visuel s'ouvre. Insérer Modèle Renseignez le modèle Graphical timeline dans le champ de recherche. Renseignez les champs concernés. Enregistrez. Autre solution, quand vous modifiez une page ou discutez avec Discussions structurées : Tapez {{ Renseignez le modèle Graphical timeline dans le champ de recherche. Renseignez les champs concernés. Enregistrez. La plupart des modèles sont documentés directement dans l’éditeur visuel.

Ce modèle est conçu pour ajouter des frises chronologiques dans les articles. Il exige un minimum de variables et s'inscrit dans un tableau. Voir [[Modèle:Graphical timeline/Documentation|Documentation complète]] pour plus de détails sur les paramètres.

Paramètres du modèle

La mise en forme multiligne est préférée pour ce modèle.

Paramètre		Description	Type	État
Depuis	from	Début temporel de la chronologie (peut être négatif).	Nombre	obligatoire
Jusqu'à	to	Fin temporelle de la chronologie (peut être négatif).	Nombre	obligatoire
Largeur	width	Largeur de la chronologie Par défaut 10	Nombre	facultatif
Titre	title	Texte de la barre de titre	Contenu	suggéré
Couleur de la barre de titre	title-colour title-color	Couleur de l'entête de la chronologie Par défaut #77bb77 Exemple #FF0000	Contenu	facultatif
ID chronologie	instance-id	ID unique pour prévenir les collisions logicielles avec d'autres chronologies.	Nombre	suggéré
Alignement	align	Alignement de la chronologie sur la page (paramètre en anglais). Par défaut right Exemple left, center, right	Contenu	facultatif
Couleur du graphique	plot-colour plot-color	Couleur de fond du graphique Par défaut inherit Exemple #C0C0C0	Contenu	facultatif
Réglage de l'échelle	scale-increment	Définit la distance entre deux traits de l'échelle de la chronologie Par défaut Calcul entre la valeur Depuis et la valeur Jusqu'à.	Nombre	facultatif
Hauteur	height	Hauteur de la chronologie Par défaut 36	Nombre	facultatif
Légende	caption	Légende de la chronologie	Wikicode non équilibré	suggéré
Unité des largeurs et hauteurs	unit	Unité à utiliser pour définir les largeurs et hauteurs des barres Par défaut em Exemple px, em, rem, %	Contenu	facultatif
Unité de la hauteur	height-unit	Unité à utiliser pour la hauteur de la chronologie Par défaut em ou la valeur du paramètre Unité Exemple px, em	Contenu	facultatif