Modèle:Graphical timeline/Documentation

Ceci est la page de documentation de Modèle:Graphical timeline [modifier] [purger].

Cette sous-page contient les instructions et les catégories de son modèle d'origine et elle n'est pas destinée à être visualisée directement.

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.

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.

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.

Cette section est vide, insuffisamment détaillée ou incomplète. Votre aide est la bienvenue ! Comment faire ?

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.

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.

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.

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.

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

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

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.

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.

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).

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.

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.

Le code à gauche produit la chronologie à droite, qui montre les limites du modèle.

{{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.
}}

• 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).

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.