Descriptions enrichies

La description d’un repère peut être plus qu’un paragraphe de texte. Écrivez un petit jeu de balises HTML dans le champ de description et la bulle du repère les affiche : titres, gras et italique, code en ligne, listes, liens, tableaux et un graphique linéaire intégré.

Le texte brut fonctionne toujours exactement comme avant — si vous n’utilisez aucune balise, rien ne change.

Mise en forme, listes et liens

Une bulle de repère montrant un titre, du texte en gras et en italique, un extrait de code en ligne, une liste à puces et un lien.

Cette bulle provient de la description suivante :

<h2>Site notes</h2>
Readings look <b>stable</b>, but sensor <code>A1</code> is <i>drifting</i>.
<ul><li>Recalibrate on Tuesday</li><li>Replace the battery</li></ul>
<a href="https://www.swisstopo.admin.ch">Reference station data</a>

Balises utilisables

Usage	Balises
Emphase	`<b>` `<strong>` `<i>` `<em>` `<u>`
Code	`<code>`
Titres	`<h1>` `<h2>` `<h3>`
Listes	`<ul>` `<ol>` `<li>`
Paragraphes et sauts	`<p>` `<br>` `<hr>`
Liens	`<a href="https://…">`
Tableaux	`<table>` `<tr>` `<th>` `<td>` (`<thead>`/`<tbody>` facultatifs)
Graphiques	`<chart>` — voir plus bas

Les lignes vides commencent un nouveau paragraphe et les sauts de ligne simples sont conservés : vous pouvez donc écrire du texte ordinaire et ne recourir à une balise que là où c’est nécessaire.

Ajouter un tableau

Une bulle de repère montrant un tableau à trois colonnes de stations, niveaux d’eau et tendances, avec une ligne d’en-tête ombrée.

<h3>Water level by station</h3>
<table>
<tr><th>Station</th><th>Level</th><th>Trend</th></tr>
<tr><td>A1</td><td>2.4 m</td><td>rising</td></tr>
<tr><td>B7</td><td>1.9 m</td><td>steady</td></tr>
<tr><td>C3</td><td>3.1 m</td><td>falling</td></tr>
</table>

Une première ligne composée uniquement de cellules <th> devient l’en-tête. Vous n’avez pas besoin de <thead> ni de <tbody> — ils sont ajoutés pour vous. Un repère contenant un tableau obtient une bulle plus large, et un tableau très large défile latéralement à l’intérieur.

Le texte des tableaux est indexé par la recherche : le panneau Repères retrouve un repère à partir d’une valeur qui n’apparaît que dans une cellule.

Ajouter un graphique linéaire

Placez une balise <chart> dans la description, avec ses données en JSON à l’intérieur.

Une bulle de repère montrant un graphique linéaire à deux séries du niveau d’eau par semaine, avec une légende au-dessus du tracé et des axes étiquetés.

<chart>{
  "v": 1,
  "type": "line",
  "title": "Water level",
  "xLabel": "week",
  "yLabel": "m",
  "series": [
    { "label": "A1", "points": [[1, 2.1], [2, 2.4], [3, 2.2], [4, 2.9]] },
    { "label": "B7", "points": [[1, 3.4], [2, 3.1], [3, 3.6], [4, 3.2]] }
  ]
}</chart>

Chaque entrée de series correspond à une courbe. points est une liste de paires [x, y] — elles n’ont pas besoin d’être ordonnées. title, xLabel, yLabel et le label de chaque série sont facultatifs ; un label vaut la peine dès que vous avez plus d’une courbe, car il la nomme dans la légende.

Champ	Remarques
`v`	Toujours `1`.
`type`	Toujours `"line"`.
`series`	De 1 à 4 séries, jusqu’à 1 000 points au total.
`label`	Nom de la série, affiché dans la légende.
`color`	Couleur hexadécimale facultative, par exemple `"#315ee7"`. Omettez-la pour utiliser la palette intégrée.

Chaque courbe reçoit sa propre couleur et son propre motif de tirets : les courbes restent donc distinguables à l’impression en noir et blanc ou pour une personne ayant une déficience de la vision des couleurs.

Prévisualiser pendant la saisie

Composer un tableau ou le JSON d’un graphique à l’aveugle n’a rien d’agréable : le champ de description dispose donc d’une bascule Aperçu. Elle rend exactement ce que la bulle affichera.

Le panneau Ajouter un repère avec l’aperçu de la description activé, affichant un tableau et un graphique sous le champ de texte.

Saisissez votre description dans le panneau Ajouter un repère ou Modifier le repère.
Cliquez sur Aperçu au-dessus du champ.
Le résultat rendu apparaît en dessous. Continuez à modifier — il se met à jour au fil de la frappe.

Gros plan sur le champ d’aperçu de la description montrant le tableau et le graphique linéaire rendus.

Bon à savoir

Partout ailleurs, c’est du texte brut. La liste des repères, les encarts de présentation, la vue d’historique et les fichiers exportés affichent une version texte lisible de votre description. Seule la bulle sur la carte rend la mise en forme.
Les descriptions sont partagées. Tout le monde dans la salle — et quiconque consulte une salle publique — voit ce que vous écrivez, et le rendu est le même pour eux que pour vous.
Il y a une limite de taille. Une description peut faire jusqu’à 20 000 caractères. Le champ vous prévient quand vous approchez, et une description dépassant la limite retombe en texte brut.
Les exports conservent votre mise en forme. Exportez une salle, réimportez-la, et la description enrichie revient exactement telle qu’elle a été écrite.

Repères et dessinPlacer des repères, icônes, photos, dates et formes dessinées.