Capteur analogique non lineaire

Bonjour,

très intéressante l’animation du cercle.
Je vois une autre application avec les détecteurs de présence Enocean qui fonctionne en entrée analogique enocean.
Exemple: sur la variable enoA7 , le cercle est vert si enoA7 <10 (non détection) , le cercle est rouge si enoA7 >200 (détection).
Le pb sur détection la valeur >200 est furtive.
Il faudrait peux être passer par une sortie virtuelle dans un scénario (ta/tb)
Exemple: le cercle est vert si SV = 0 (non détection) , le cercle est rouge si SV =1 (détection).
Merci et cordialement

1 « J'aime »

Bonjour,

oui, c’est faisable.
Mais le widget fonctionnant sur datasource, le temps de rafraichissement est bien plus long que pour une jauge analogique. Il faudra régler le Tb de la sortie virtuelle tel qu’il soit supérieur au refresh.

bonne idée.

cdt

Bonjour,

j’ai réglé le Tb à 1 mn pour ne pas être pollué par chaque passage devant le capteur.
En utilisant une Sortie virtuelle cela simplifie beaucoup le script initial.
La SV est activée, dans un scénario, par les seuils haut et bas du capteur de présence Enocean.

SV=1 cercle rouge
SV=0 cercle vert

Merci et cdlt

peux tu partager ton code ?

je suis désolé, je ne sais pas programmer.

je pensais que tu avais écrit le code pour avoir un cercle rouge.

voilà le code :wink:
il est basé sur Status.xml

function bruteToDistance(brute) {
  d = Math.floor(63.37 * Math.pow(brute * 0.000050354,-1.143));
    
    if (d < 20 || d > 150) {
        return "";
    }else{
        return d + " cm";
    }
}

var distance = bruteToDistance(datasources["STATUS"]["response"]["analog0"]);
//modifiez Vout5 par la sortie virtuelle utilisée pour mémoriser un passage
var passage = datasources["STATUS"]["response"]["vout5"];
// l'activité du capteur est récupérée avec l'état de relais 1
//en fonction de l'état, l'animation sera rendue non visible (active mais couleur du fond), sinon verte
var SharpCouleur = (datasources["STATUS"]["response"]["led0"]==0) ? "#333" : (passage==1) ? "#f00" : "#3C14";

return `
<style>
.content {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #333;
  overflow: hidden;
}

.circle {
  width: 5px;
  height: 5px;
  background-color: transparent;
  position: absolute;
  left: 50%;
  margin-left: -2px;
  top: 50%;
  margin-top: -2.0px;
  border-radius: 50%;
border: 2px solid ${SharpCouleur};
  animation: radar 0.6s infinite;
  -webkit-animation: radar 0.6s infinite;
  -webkit-transition: all ease-in-out;
  transition: all ease-in;
}
@keyframes radar {
  1% {
    width: 5px;
    height: 5px;
    margin-left: 0;
    margin-top: 0px;
border: 2px solid ${SharpCouleur};
    opcity:0.9
  }
  100% {
    width: 300px;
    height: 300px;
    margin-left: -150px;
    margin-top: -150px;
border: 12px solid ${SharpCouleur};
    opacity:0.0;
    
  }
}

</style>

<center>
  <div class="content" height=100%> <div valign=middle style="color:#fff;font-size: 20px;"> ${distance}</div> <div class="circle">
  </div>

</div>
</center>
`;
2 « J'aime »

je le rajoute dans le tuto

Bonjour

merci pour le code.

sur les changements d’état de « vout0 » j’ai toujours le cercle vert.

Cdlt

Bjr,

je l’ai testé, ça fonctionne

edit : oui, le code est fait arbitrairement sur Vout0 alors que l’activation du capteur est sur la même SV.
change de SV dans le code et adapte ton scenario.
j’ai modifié l’exemple par Vout5

cdt

j’utilise SV2 ce qui correspond à vout1 en xml.

Cdlt

SV2 est déjà utilisée si tu as pris le widget version « avancée »

voici mes tests sur SV6

  1. SV6 ON
    image

  2. SV6 OFF
    image

j’ai fait un essais avec vout31 (SV32)

function bruteToDistance(brute) {
  d = Math.floor(63.37 * Math.pow(brute * 0.000050354,-1.143));
    
    if (d < 20 || d > 150) {
        return "";
    }else{
        return d + " cm";
    }
}

var distance = bruteToDistance(datasources["IPX800 V4 2"]["response"]["enoA7"]);
var passage = datasources["IPX800 V4 2"]["response"]["vout31"];
// l'activité du capteur est récupérée avec l'état de l'entrée digitale 1
//en fonction de l'état, l'animation sera rendue non visible (active mais couleur du fond), sinon verte
var SharpCouleur = (datasources["IPX800 V4 2"]["response"]["led0"]==0) ? "#333" : (passage==1) ? "#f00" : "#3C14";

return `
<style>
.content {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #333;
  overflow: hidden;
}


..............

Cdlt

dans le code, ton capteur est supposé être alimenté par le Relais 1 (led0), c’est le cas ?

EnoA7 : tu actives SV sur seuil haut ou bas ?

Bonjour,

l’entrée analogique enoA7 n’est pas nécessaire car son changement de valeur est très furtive, je passe par une SV avec un Tb.
Serait il possible de simplifier le code ?
Le calcul de distance, au début du code,n’est pas nécessaire ainsi que la ligne avec led0.
Pour voutx=1 cercle rouge (détection, ou seuil haut entrée analogique scénario de enoAx)
Pour voutx =0 cercle vert (non détection, ou seuil bas entrée analogique scénario de enoAx)

Merci et cordialement

c’est vrai que le code était initialement prévu pour un télémètre analogique.
Voici le code simplifié pour un capteur de mouvement


//modifiez Vout5 par la sortie virtuelle utilisée pour mémoriser un passage
var passage = datasources["STATUS"]["response"]["vout5"];
//enfonction de VouX, animation verte (Vout=0) ou rouge (Vout=1)
var SharpCouleur = (passage==1) ? "#f00" : "#0f0";

return `
<style>
.content {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #333;
  overflow: hidden;
}

.circle {
  width: 5px;
  height: 5px;
  background-color: transparent;
  position: absolute;
  left: 50%;
  margin-left: -2px;
  top: 50%;
  margin-top: -2.0px;
  border-radius: 50%;
border: 2px solid ${SharpCouleur};
  animation: radar 0.6s infinite;
  -webkit-animation: radar 0.6s infinite;
  -webkit-transition: all ease-in-out;
  transition: all ease-in;
}
@keyframes radar {
  1% {
    width: 5px;
    height: 5px;
    margin-left: 0;
    margin-top: 0px;
border: 2px solid ${SharpCouleur};
    opcity:0.9
  }
  100% {
    width: 300px;
    height: 300px;
    margin-left: -150px;
    margin-top: -150px;
border: 12px solid ${SharpCouleur};
    opacity:0.0;
    
  }
}

</style>

  <div class="content" height=100%> <div valign=middle style="color:#fff;font-size: 20px;"></div> <div class="circle"></div></div>
`;

la rapidité de l’animation peut être réglée par les 2 valeurs dans le CSS
image
Cela permet d’ajuster en fonction de la fréquence de rafraichissement de la Datasource.

1 « J'aime »

super et encore merci.

pour le changement d’état de voutx, il faut attendre le rafraîchissement du xml.

Cdlt

C’est bon ? ça marche ?

oui le xml pilote, mais je pense que ta datasource est à 1s, ta Vout est à 1 minute (tb)
Donc la datasource a peu d’influence.
Par contre, le widget est rafraichi à chaque changement de la datasource. Il faut donc régler l’animation avec une durée inférieure si tu ne veux pas avoir des saccades dans l’animation. C’est pour cela que je l’ai mise à 0.6, on peut aller jusqu’à 1s comme la datasource, mais pas plus.

1 « J'aime »