> For the complete documentation index, see [llms.txt](https://docs.kiloiot.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.kiloiot.io/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets.md).
# Ajout de widgets
Ajoutez et configurez des widgets de tableau de bord Kilo pour les données en direct, les graphiques, les commandes, les cartes, les images, le texte et les pages intégrées.
Les widgets sont les composants visuels d’un tableau de bord. Les widgets de données se connectent aux appareils et transforment les relevés en valeurs actuelles, historiques, cartes ou états. Les widgets de contrôle envoient des commandes configurées. Les widgets Texte et iFrame ajoutent du contexte sans connexion à un appareil. Une mesure de température de 22 °C est normale dans un bureau, mais constitue une violation de conformité en chambre froide — les plages, seuils et conditions permettent aux opérateurs de voir ce contexte d’un coup d’œil au lieu d’interpréter eux-mêmes la valeur brute.
## Passage en mode édition
Les widgets ne peuvent être ajoutés ou modifiés que lorsque le tableau de bord est en **mode édition**.
1. Ouvrez un tableau de bord depuis la barre latérale.
2. Cliquez sur le **menu d’actions** (trois points) dans l’en-tête et sélectionnez **Modifier le tableau de bord**.
En mode édition, l’en-tête change :
* L’ **Données en direct** indicateur est remplacé par une petite **icône de crayon** pour modifier les métadonnées du tableau de bord.
* Un **bouton plus** apparaît — cela ouvre le sélecteur de widgets.
* **Annuler** et **Enregistrer** les boutons apparaissent à droite.
Toute modification effectuée en mode édition n’est enregistrée que lorsque vous cliquez sur **Enregistrer**. **Annuler** annule toutes les modifications et revient au mode affichage.
## Le sélecteur de widgets
Cliquez sur le **bouton plus** dans l’en-tête du mode édition (ou le **Ajouter un widget** bouton dans l’état vide) pour ouvrir le sélecteur de widgets.
Le sélecteur affiche les types de widgets disponibles.
| Widget | Utilisez-le lorsque | Ce qu’il affiche |
| -------------------------------- | ------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------- |
| **Dernières données** | Les opérateurs ont besoin de l’état actuel d’une machine, d’un processus ou d’un équipement | Dernière valeur reçue — en marche/à l’arrêt, niveau de remplissage, température actuelle |
| **Graphique** | Vous devez comprendre comment une mesure a évolué — historique de conformité, dérive ou comparaison d’un poste à l’autre | Graphique historique avec la mesure actuelle en direct |
| **Texte** | Un tableau de bord a besoin de titres, de notes d’exploitation ou d’instructions | Texte mis en forme qui n’est pas connecté à un appareil |
| **Image** | Le contexte de localisation compte — quelle zone, quel étage ou quel composant | Votre propre image importée — plan d’étage, schéma de machine ou plan du site — avec des relevés numériques en direct épinglés aux emplacements |
| **Carte** | L’emplacement en direct de quelque chose qui se déplace est important | Position GPS actuelle sur une carte extérieure interactive, plus une valeur de capteur sélectionnée sur le marqueur |
| **Contrôle** | Un opérateur doit envoyer une commande configurée à un équipement | Un interrupteur, un bouton, une entrée ou un curseur connecté à un appareil contrôlable |
| **iFrame** | Le contexte externe a sa place sur le même écran — un rapport BI, une carte météo, le trafic en direct | Une page web externe en direct provenant d’un service pris en charge, intégrée dans la tuile à côté de vos données d’appareil |
| **Jumeau numérique du bâtiment** | Vous voulez un modèle 3D d’un bâtiment avec des capteurs associés aux objets qu’ils surveillent | Un éditeur 3D intégré qui transforme une installation en scène vivante, recolorée par les mesures des capteurs |
## Choisir un type de widget
**Dernières données** est votre option par défaut pour afficher l’état opérationnel actuel. Utilisez-le lorsque vous devez afficher la dernière valeur d’un ou de plusieurs appareils dans un seul panneau — une simple valeur numérique pour une lecture rapide, une jauge en anneau ou en camembert lorsque la valeur a une échelle significative (niveau de remplissage d’un réservoir, niveau de batterie, pourcentage dans une plage). Plusieurs appareils peuvent être regroupés dans un seul widget.
**Graphique** sert à visualiser les tendances. Il affiche une grande valeur actuelle en haut et le graphique historique en dessous — vous voyez où se trouve la mesure maintenant et comment elle y est parvenue. Choisissez un [Graphique linéaire](/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets/chart-widget/line-chart.md) pour une tendance continue ou un [Graphique en barres](/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets/chart-widget/bar-chart.md) pour comparer des rapports individuels. Une seule source de données et une seule métrique par widget Graphique.
**Texte** ajoute des titres, des instructions et des notes d’exploitation. C’est un widget de contenu autonome et il n’appartient pas à la famille des widgets de contrôle.
**Image** place les données dans un contexte physique. Téléversez un plan d’étage, un schéma du site ou un schéma d’équipement, puis épinglez les relevés de capteurs en direct à leurs emplacements exacts. Utilisez-le lorsque l’emplacement compte — surveillance des zones d’entrepôt, état CVC du bâtiment par étage, températures des baies de la salle serveur.
**Carte** indique où se trouve actuellement un appareil équipé d’un GPS sur une carte extérieure interactive, avec une métrique supplémentaire sur le marqueur. Véhicules, équipements de terrain, outils mobiles, expéditions, bétail — tout ce qui se déplace et signale sa position peut y être affiché. Les commandes de plage de dates vous permettent de consulter l’historique des trajets sans quitter le tableau de bord.
**Contrôle** envoie une commande d’appareil configurée via un Interrupteur, un Bouton, une Entrée ou un Curseur. C’est le seul widget de niveau sélecteur dont l’objectif est de contrôler des équipements ; Graphique, Texte, Image et Carte sont des types de widgets distincts.
**Jumeau numérique du bâtiment** est un modèle 3D d’une installation, créé et modifié directement sur le tableau de bord. Dessinez le bâtiment, placez des objets depuis un catalogue et associez chacun à un capteur — le modèle se recolore alors en temps réel, afin qu’un opérateur lise l’état de l’installation de manière spatiale plutôt que dans une liste. Voir [Jumeau numérique du bâtiment](/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets/digital-building-twin.md).
## Ajouter un widget
Pour chaque type de widget, le processus de configuration suit le même schéma :
1. Cliquez sur le **bouton plus** ou **Ajouter un widget** bouton pour ouvrir le sélecteur.
2. Sélectionnez un type de widget.
3. Le panneau de configuration du widget sélectionné s’ouvre.
4. Pour un widget basé sur les données, choisissez son appareil et sa métrique sous **Source de données**, puis configurez sa présentation sous **Apparence**. Les widgets autonomes comme Texte et iFrame ouvrent plutôt leurs propres paramètres de contenu.
5. Cliquez sur **Enregistrer** dans le panneau pour ajouter le widget.
Un **bouton de fermeture** (icône X) en haut à droite ferme le panneau sans enregistrer. Le **Suivant** bouton permet de passer de Source de données à Apparence. Les paramètres ne sont appliqués que lorsque vous cliquez sur **Enregistrer** dans le panneau, puis sur **Enregistrer** dans l’en-tête du tableau de bord.
Pour tous les détails de configuration, consultez les pages spécifiques aux widgets liées ci-dessous.
## Modifier un widget existant
Pour modifier un widget déjà présent sur le tableau de bord :
1. Passez en mode édition.
2. Survolez le widget. Un **menu à trois points** apparaît dans le coin supérieur droit.
3. Cliquez sur le menu :
* **Modifier** — Ouvre le panneau de paramètres du widget avec les valeurs actuelles préremplies.
* **Dupliquer** — Crée une copie du widget, avec toute sa configuration, sur le même tableau de bord. Un toast confirme **"Widget dupliqué avec succès"**; si la copie ne peut pas être créée, vous verrez **"Impossible de dupliquer le widget"**.
* **Déplacer vers le tableau de bord** — Déplace le widget vers un autre tableau de bord. Si le déplacement ne peut pas être effectué, vous verrez **"Impossible de déplacer le widget"**.
* **Supprimer** — Marque le widget pour suppression. La suppression n’est appliquée que lorsque vous cliquez sur **Enregistrer** dans l’en-tête du tableau de bord. En cliquant sur **Annuler** restaure le widget.
Le menu à trois points n’apparaît qu’en mode édition.
**Dupliquer** fait gagner du temps lors des déploiements répétitifs. Configurez un widget exactement comme vous le souhaitez — plages de valeurs, seuils, type d’affichage, conditions — puis dupliquez-le une fois par capteur identique et changez uniquement l’appareil dans l’onglet Source de données. Cinquante unités de stockage frigorifique avec la même bande de conformité sont cinquante copies d’un même widget, et non cinquante configurations créées de zéro.
**Déplacer vers le tableau de bord** est destiné aux cas où une vue dépasse son emplacement d’origine — une métrique ajoutée à un tableau de bord général du site se révèle devoir aller sur le tableau de bord de conformité, ou un widget a été créé sur le mauvais tableau de bord. Déplacez-le plutôt que de le recréer.
## L’état vide du tableau de bord
Si un tableau de bord ne contient aucun widget, le centre de l’écran affiche :
* **"Vous n’avez aucun widget ici"**
* **"Ajoutez votre premier widget pour créer votre tableau de bord"**
* Un **Ajouter un widget** bouton
## Personnalisation en un coup d’œil
Les widgets sont configurables, et non des cartes figées. Les options clés disponibles selon les types de widgets :
* **Types d’affichage des dernières données** — Valeur, anneau, camembert, tube, jauge et jauge radiale
* **Types de graphiques** — Linéaire et barres, avec des plages temporelles, axes, seuils et légendes propres au graphique
* **Types de contrôle** — Interrupteur, bouton, entrée et curseur ; le curseur propose ensuite les styles Simple, Circulaire et Vertical
* **Plages de valeurs** — Bornes min./max. qui définissent l’échelle de la jauge ou les limites de l’axe Y du graphique
* **Seuils** — Bandes nommées (par ex. « Conforme », « Avertissement », « Non-conformité ») avec couleurs, remplissages et lignes — widget Graphique
* **Conditions** — Règles de couleur par métrique basées sur la valeur actuelle du capteur — widgets Dernières données et Image
* **Contrôles au niveau de la métrique** — Type de données, sélecteur de métrique de l’appareil, icône et conditions par capteur
## Guides de configuration des widgets
* [Widget Dernières données](/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets/last-data-widget.md) — Dernières valeurs, types de jauge, plages de valeurs et conditions
* [Widget Graphique](/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets/chart-widget.md) — Graphiques de séries temporelles avec mesure actuelle en direct et bandes de seuil
* [Widget Texte](/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets/text-widget.md) — Titres, instructions et notes sans source d’appareil
* [Widget Image](/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets/image-widget.md) — Toute image — un plan d’étage, un schéma d’équipement, une photo du site — avec des repères de données en direct déplaçables
* [Widget Carte](/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets/map-widget.md) — Emplacement d’un traceur GPS avec commandes d’historique d’itinéraire
* [Widget de contrôle](/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets/control-widget.md) — Interrupteurs, boutons, entrées et curseurs qui envoient des commandes à l’appareil
* [Widget iFrame](/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets/iframe-widget.md) — Intégrez une page web externe d’un service pris en charge à côté de vos données d’appareil
* [Conditions](/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets/conditions.md) — Règles de couleur par métrique pour les widgets Dernières données et Image
## Pages associées
* [Créer des tableaux de bord](/kilo-docs-fr/kilo-iot-server/dashboards/creating-dashboards.md) — Créez le tableau de bord avant d’ajouter des widgets.
* [Organiser les tableaux de bord](/kilo-docs-fr/kilo-iot-server/dashboards/organizing-dashboards.md) — Gérez les dossiers et l’ordre des tableaux de bord.
* [Données en temps réel](/kilo-docs-fr/kilo-iot-server/dashboards/real-time-data.md) — Comment les données des capteurs en direct parviennent à vos widgets.
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:
```
GET https://docs.kiloiot.io/kilo-docs-fr/kilo-iot-server/dashboards/adding-widgets.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
