Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨

[ioAli]

Ich möchte auf meiner Wetter-Vis die Textfarbe des dargestellten UV-Index abhängig vom UV-Index-Wert ändern.

Dazu werte ich den UV-Index aus und teile die Fraben wie folgt zu:

! ````
/* ********************************************************************************** /
/ Merkt sich den aktuelle und max. UV-Index /
/ ********************************************************************************** */
on({id: "weatherunderground.0.current.UV", valNe: true}, function (obj) {
var actState = getState("weatherunderground.0.current.UV");
console.log("UV: "+actState.val);
setState("javascript.0.Wetter.Heute.UVIndexAktuell",actState,true);

if (actState.val > getState("javascript.0.Wetter.Heute.UVIndexMax").val){
    setState("javascript.0.Wetter.Heute.UVIndexMax",actState,true);
    console.log("UVIndexMax: "+getState("javascript.0.Wetter.Heute.UVIndexMax").val);
}
// TextFarbe vom aktuellen UV-Index einstellen
setState("javascript.0.Umweltsensor.UVIndexColor",getUVIndexColor(actState.val).SColor);

  // TextFarbe vom UV-Index-Max einstellen
actState = getState("javascript.0.Wetter.Heute.UVIndexMax");  
setState("javascript.0.Umweltsensor.UVIndexMaxColor",getUVIndexColor(actState.val).SColor);

});

! /* ********************************************************************************** /
/ Ermittelt die Textfarbe anhand des UV-Indexwert /
/ ********************************************************************************** */
function getUVIndexColor (UVidx){
var strCol ='';

// ermittelt die Darstellungsfarbe des UV-Index abhängig von diesem gemäß https://de.wikipedia.org/wiki/UV-Index
if          (UVidx >= 0.0 && UVidx <= 2.5){ strCol = "#12ed43"; // grün
}else if    (UVidx >  2.5 && UVidx <= 5.5){ strCol = "#fefd06"; // Gelb
}else if    (UVidx >  5.5 && UVidx <= 7.7){ strCol = "#f29c26"; // orange
}else if    (UVidx >  7.5 && UVidx <= 10.5){strCol = "#d31512"; // rot
}else if    (UVidx > 10.5 ){                strCol = "#d22daa"; // lila
}
console.log("idx / Farbe: "+UVidx+" / "+strCol);
return {
    'SColor' : strCol
};

}

! ````

Nun möchte ich diesen Farbcode in den Parameter "Color" in der Gruppe "CSS Fond & Text" vom Widget "basic - Number" eintragen.

Wie kann ich aus einen script unter javascript.0 auf das Paramterfeld zugreifen?

ODER

Gibt es eine Möglichkeit die Zuordnung des Farbcodes über die Kachel Skripte vom Widget zu realisieren?

[ioAli]

Hallo zusammen,

mir ist aufgefallen (bin noch neu hier und muss mich erst orientieren) das ich dieses Thema vermutlich im falschen Forum gepostet habe.

Es gehört eher ins Forum "ioBroker.vis Adapter", vielleicht kann ein Mod es bei Bedarf dort hin verschieben.

Ich habe jedenfalls eine Lösung für die Aufgabe gefunden:

In den Feldern für die Text-Farbwerte innerhalb der Widgets kann statt der konstanten Wert (z. B. #12ed43)

auch die Referenz auf einen Datenpunkt wie folgt angegeben werden:

{javascript.0.Umweltsensor.UVIndexColor}

Durch die beiden {} wird als Farbwert dann der Inhalt dieses Datenpunktes verwendet.

UVIndexColor muss dabei vom Type String sein. Damit ergeben sich ganz neue Möglichkeiten interaktiv auf das Aussehen der Widgets aus einem Script heraus zu nehmen.

Allerdings habe ich das noch nicht in anderen Parameterfeldern der Widgets probier, steht aber in kürze an.

[pix]

Hallo ioAli,

das ganze nennt sich Binding und ist auf der VIS Github Doku gleich am Anfang beschrieben. Es gibt viele Beispiele hier im Forum.

Nach meiner Meinung sind das Binding und die OID-abhängige Sichtbarkeit die größten und besten Features von VIS.

Gruß

Pix

[ioAli]

@pix:

…..

Nach meiner Meinung sind das Binding und die OID-abhängige Sichtbarkeit die größten und besten Features von VIS.

Gruß

Pix `
Hallo Pix

das sehe ich genau so.

Kann ich denn umgekehrt aus einem Skript auf die Views und deren Widget-Elemete und -Parameter zugreifen?

Gruß

ioAli

[totocotonio]

@ioAli:

Ich möchte auf meiner Wetter-Vis die Textfarbe des dargestellten UV-Index abhängig vom UV-Index-Wert ändern.

Dazu werte ich den UV-Index aus und teile die Fraben wie folgt zu:

! ````
/* ********************************************************************************** /
/ Merkt sich den aktuelle und max. UV-Index /
/ ********************************************************************************** */
on({id: "weatherunderground.0.current.UV", valNe: true}, function (obj) {
var actState = getState("weatherunderground.0.current.UV");
console.log("UV: "+actState.val);
setState("javascript.0.Wetter.Heute.UVIndexAktuell",actState,true);

if (actState.val > getState("javascript.0.Wetter.Heute.UVIndexMax").val){
    setState("javascript.0.Wetter.Heute.UVIndexMax",actState,true);
    console.log("UVIndexMax: "+getState("javascript.0.Wetter.Heute.UVIndexMax").val);
}
// TextFarbe vom aktuellen UV-Index einstellen
setState("javascript.0.Umweltsensor.UVIndexColor",getUVIndexColor(actState.val).SColor);


  // TextFarbe vom UV-Index-Max einstellen
actState = getState("javascript.0.Wetter.Heute.UVIndexMax");  
setState("javascript.0.Umweltsensor.UVIndexMaxColor",getUVIndexColor(actState.val).SColor);

});

! /* ********************************************************************************** /
/ Ermittelt die Textfarbe anhand des UV-Indexwert /
/ ********************************************************************************** */
function getUVIndexColor (UVidx){
var strCol ='';

// ermittelt die Darstellungsfarbe des UV-Index abhängig von diesem gemäß https://de.wikipedia.org/wiki/UV-Index
if          (UVidx >= 0.0 && UVidx <= 2.5){ strCol = "#12ed43"; // grün
}else if    (UVidx >  2.5 && UVidx <= 5.5){ strCol = "#fefd06"; // Gelb
}else if    (UVidx >  5.5 && UVidx <= 7.7){ strCol = "#f29c26"; // orange
}else if    (UVidx >  7.5 && UVidx <= 10.5){strCol = "#d31512"; // rot
}else if    (UVidx > 10.5 ){                strCol = "#d22daa"; // lila
}
console.log("idx / Farbe: "+UVidx+" / "+strCol);
return {
    'SColor' : strCol
};

}

! ````

Hi,

ich habe das so umgestzt.

Die Werte für den Index werden mir eingetragen.

Nur in den Farbwerten wird immer "true" eingetragen, ws mache ich denn da falsch.

Die pfade in Javascript stimmen.

Kann mir da jemand helfen.

Gruß TM