Jauge analogique avec X-THL

Cartes Ethernet IPX800
1

Bonjour le Forum
Savez-vous s’il est possible d’afficher les données d’un X-THL sur ce type de jauge :
image

'Fichier:Fgtoul4-canvas.PNG — GCE Electronics

Ou des données OpenWeather sur celle-ci :
image

'Fichier:Fgtoul5-canvas.PNG — GCE Electronics

J’ai essayé ce tuto, mais rien à faire :
https://wiki.gce-electronics.com/index.php?title=Jauges_analogiques

Merci pour vos réponses
Alex

2

Bonjour @AlexFisho

Vous avez quel IPX ?

Si vous êtes en V5 ça pourra vous aidé.

Bonne soirée

3

Bonjour et merci la réponse rapide, j’ai une IPX800 V4

Alex

4

Bonjour @AlexFisho
si vous êtes sur V4, Il n’y aura que la personnalisation de la jauge à faire, et une très légère adaptation du script dans lequel il faut mettre les formules du X-THL :
exemple avec XTHL N°1
dans status.xml, le THL 01 est représenté par les variables suivantes

  • « THL1-TEMP »
  • « THL1-HUM »
  • « THL1-LUM »

les formules d’un THL sont

  • Analogue > Valeur
    Luminosité : Aucune formule appliquée
    Humidité : 125 * x / 65535 - 6
    Température : 175.72 * x / 65535 - 46.85
  • Valeur > Analogue
    Luminosité : Aucune formule appliquée
    Humidité : (x + 6) * 65535 / 125
    Température : (x + 46.85) /175.72 * 65535

Le script devient donc

a=((datasources["STATUS"]["response"]["THL1-TEMP"] + 46.85) /175.72 * 65535).toFixed(2);
b=((datasources["STATUS"]["response"]["THL1-HUM"]  + 6) * 65535 / 125).toFixed(2);
c=(datasources["STATUS"]["response"]["THL1-LUM"] ).toFixed(0);

var gauge1 = document.gauges.get('gauge1');
var gauge2 = document.gauges.get('gauge2');
var gauge3 = document.gauges.get('gauge3');
gauge1.value=Math.floor(a);
gauge2.value=Math.floor(b);
gauge3.value=Math.floor(c);

Pensez

  • à créer la source de données STATUS sur le dashboard où sont placées les jauges
  • mettre une référence au script externe (library) dans un des widgets

<script async src="//cdn.rawgit.com/Mikhus/canvas-gauges/gh-pages/download/2.1.5/all/gauge.min.js"/>

EDIT : dans le script, les étiquettes à utiliser sont xths01, xths02 et xths03 au lieu de THL1-TEMP, THL1-HUM,THL1-LUM

bonne journée

5

Merci @fgtoul
Je ne suis pas très à l’aise avec les scripts, j’ai fait un copier coller de votre code sur un type de Widget html, puis sur la console Javascript, mais il doit manquer les entêtes ou d’autres balises :

image
image414×633 33.5 KB

6

pouvez-vous copier/coller votre code pour que nous vous aidions ?

7

Bonjour et encore merci,
Je repprend le sujet après une petite absence professionnelle, voici le code que j’ai mis dans un Widget HTML 1 block :

<script language="JavaScript" type="text/JavaScript">
a=((datasources["STATUS"]["response"]["THL1-TEMP"] + 46.85) /175.72 * 65535).toFixed(2);
b=((datasources["STATUS"]["response"]["THL1-HUM"]  + 6) * 65535 / 125).toFixed(2);
c=(((datasources["STATUS"]["response"]["THL1-LUM"] ).toFixed(0);

var gauge1 = document.gauges.get('fgtoul1');
var gauge2 = document.gauges.get('gauge2');
var gauge3 = document.gauges.get('gauge3');
gauge1.value=Math.floor(a);
gauge2.value=Math.floor(b);
gauge3.value=Math.floor(c);
</script>
8

Voici ma source de données :

image
image902×380 4.99 KB

9

Et le code de ma jauge :

<canvas data-type="radial-gauge" id=fgtoul1></canvas>
<script async src="//cdn.rawgit.com/Mikhus/canvas-gauges/gh-pages/download/2.1.5/all/gauge.min.js"/>
10

Re
Je ne trouve pas de THL1-TEMP et autres dans le status.xml, par contre j’ai ces 3 variables:

<xths01>29960</xths01>
<xths02>24592</xths02>
<xths03>4867</xths03>

ça vous dit quelque chose ?
Cordialement

11

bonjour,
ce sont les 3 variables qui correspondent au THL01.
dans l’ordre Température, humidité, luminosité
En effet, j’ai fait une erreur dans mon script initial, je le corrige pour les lecteurs

12

pour le script, sur IPX800 V4 il faut enlever les balises <script..> et </script>

a=((datasources["STATUS"]["response"]["xths01"]* 175.72  /  65535) - 46.85)).toFixed(2);
b=((125 * datasources["STATUS"]["response"]["xths02"] / 65535)- 6).toFixed(2);
c=(datasources["STATUS"]["response"]["xths03"] ).toFixed(0);

var gauge1 = document.gauges.get('fgtoul1');
var gauge2 = document.gauges.get('gauge2');
var gauge3 = document.gauges.get('gauge3');
gauge1.value=Math.floor(a);
gauge2.value=Math.floor(b);
gauge3.value=Math.floor(c);
13

Sans les balises d’entête et de fin ça donne ça :

image

14

une erreur avec les parenthèses :
c=(((datasources["STATUS"]["response"]["xths03"] ).toFixed(0);
à corriger par
c=(datasources["STATUS"]["response"]["xths03"] ).toFixed(0);

15

Je ne crois pas, j’ai 2 parenthèses ouvrantes et 2 fermantes.
1 fermante après la division et une fermante après la multiplication.

16

pour la variable c ?

vous pouvez reprendre mon code (2 messages au dessus).

17

Bonjour fgtoul, merci pour ton temps.
J’ai trouvé :

image
image287×586 21.3 KB

Avec le code suivant :

a=(175.72 * datasources["STATUS"]["response"]["xths01"] / 65535 - 46.85).toFixed(2);
/*a=((datasources["STATUS"]["response"]["xths01"] + 46.85) /175.72 * 65535).toFixed(2);*/
var gauge2 = document.gauges.get('gaugetemp2');
gauge2.value=Math.floor(a);
1 « J'aime »