Overview

Le widget Gauge est conçu pour afficher une valeur dans une jauge, fournissant des indicateurs visuels colorés pour montrer les limites et le positionnement des données par rapport aux limites de la jauge.

Personalize the Card

Title

Les utilisateurs peuvent ajouter un titre au widget Gauge.

Description

Les utilisateurs ont l'option d'ajouter une description au widget Gauge.

Hyperlink

Le mode "link on click" (lien au clic) é une jauge. C'est une configuration qui redirige vers une URL lors d'un clic sur un élément du tableau de bord. Cela l'ouvrira dans un nouvel onglet ou dans le même onglet, selon le choix de l'utilisateur.

Configuring Custom Gauges

Les jauges sont un type de widget dans l'application Studio.

Elles peuvent être configurées manuellement via l'interface graphique du tableau de bord Studio ou configurées avec l'objet msg.parameters dans DFM. Pour basculer entre ces modes, l'utilisateur doit actionner le bouton ci-dessous.

L'objet parameters pour le widget gauge a le format suivant :

msg.parameters.gauge.min et msg.parameters.gauge.max affichent respectivement les valeurs de gauche et de droite.

Ex : msg.parameters.gauge.min = 4.5 et msg.parameters.gauge.max = 5 et si UNIQUEMENT ces paramètres sont spécifiés, la jauge s'affichera avec une seule couleur comme indiqué ci-dessous :

Pour afficher d'autres sections, le tableau « sections » doit être utilisé.

Chaque entrée du tableau comporte quatre paramètres objets appelés « color », « start », « end » et « displayTheseLimits ».

color
Color accepte un code hexadécimal pour la couleur de la section.
Ex : {color: "#FF0000"} créera une section rouge.

start
Start accepte une valeur numérique qui représente le début de la section.
Ex : {start: 0}

end
End accepte une valeur numérique qui représente la fin de la section.
Ex : {end: 200}

displayTheseLimits
DisplayTheseLimits est un objet qui accepte une valeur booléenne.

Seule UNE section peut avoir la valeur {displayTheseLimits: true} et AUCUNE des limites n'a besoin d'avoir {displayTheseLimits: true} pour que les limites soient affichées.

Dans la plupart des cas, {displayTheseLimits: false} sera spécifié pour TOUTES les sections car, dans ce mode, TOUTES les limites seront affichées et les valeurs maximale et minimale seront celles spécifiées dans les objets msg.parameters.gauge.min et msg.parameters.gauge.max.

Si {displayTheseLimits: true} est spécifié, le maximum et le minimum de cette section seront affichés pour toute la jauge. Cela annulera et remplacera les valeurs définies pour msg.parameters.gauge.min et msg.parameters.gauge.max.

Exemple d'objet parameters entièrement configuré :

L'affichage résultant dans Studio :

De plus, vous pouvez désormais modifier la taille de vos jauges et la façon dont elles s'affichent dans votre tableau de bord Studio. Cela permet une plus grande personnalisation de l'aspect et de la convivialité de l'application Studio.