znázornění AKU nádrže - gradietní vybarvení dle teplot

[ringo]

Kdysi jsem na SDS micro vytvořit ovládní tepelného čerpadla, kdy v HTML stránce v obrázku vytvořeném pomocí SVG se mi dařilo zobrazit nahřátí aku nádrže vybarvením pomocí barevného gradientu závislého na teplotách v jednotlivých úrovní nádrže (použití <rect fill="url(#grad1)" x="8.0" y="7.1" width="4.1" height="11.4" rx="2" ry="1"/> a ve style byl nadefinován tento gradient)

Nyní se pokouším přenést toto ovádání do HA (abych na to navázal další automatizace a neměl ovládání na více místech) ale to vybarvení mě vůbec nenapadá jak realizovat.
Samozřejmě se tam dá načíst i původní WWW stránka, ale to nefunguje pro vzdálené připojení a a nedoplním tam ovládací prvky pro HA.
Takto to mám v HA zatím nyní :

Nemáte prosím někdo tip jak na to a jestli vůbec něco takového lze realizovat přímo v Lovelace?

[Lion®]

předpokládám, že budeš potřebovat tolik obrázků nádrže kolik si představuješ vizuálních výsledků a podle teplot je obměňovat
nevím o kartě která by to dokázala jinak
ale třeba se pletu
https://www.home-assistant.io/dashboard ... -elements/

[bimbop]

Zkusil bych Floor plan. Ještě tady https://community.home-assistant.io/t/c ... s/375604/4 něco řešili.

[ringo]

Bingo, nakonec se mi podařílo najít jak na to - doplněno do karty picture-element za použití addonu https://github.com/thomasloven/lovelace-card-mod. V kartě jako první element přidám obrázek a ten je pak dalšími elementy přepisován. Jako obrázek jsem použil malinky obdélník v levém horním rohu vytvořený v Inkscape-takže spíše ten obrázek je jen prázdná stránka.
No a pak na to použiji následující kód:

Kód: Vybrat vše

type: picture-elements
elements:
  - type: image
    entity: pokus
    image: /local/obdelnikredmini.svg
    card_mod:
      style: |
        :host {
          background: linear-gradient(to top, rgb({{states("sensor.sds_zas1_f")|int*5}},0,255),rgb({{states("sensor.sds_zas2_f")|int*5}},0,0),..,rgb({{states("sensor.sds_zas5_f")|int*5}},0,0));
          width: 6%;
          top: 59%;
          left:47%;
          height: 50%;
          }
........

A dostanu toto (ta zelená uprostřed je tam vnucena ručně pro kontrolu)

Nyní tam mám zkušebně pro každý senzor teplot vytvořen text "rgb({{states("sensor.sds_zas1_f")|int*5}},0,255)" ale v praxi by to mělo být ve tvaru RGB(fce1(teplota),0,fce2(teplota)) - tj barvu skládat z intenzity červené a modré, kde mám již z drívějška vytvořenu funkci která vrací řetězec "RGB(R,0,B)" kdy to R a G jsou konkrétní čísla v závislostě na teplotě do funkce vstupující:

Kód: Vybrat vše

function temptoRGB(intemper){
	var jrrgb;
	if (intemper<20) {jrrgb="(0,0,255)";
			} else { if (intemper<37) {jrrgb="("+((intemper-20)*255/(37-20)).toFixed()+",0,255)";
		                                 } else { if (intemper<55) {jrrgb="(255,0,"+(255-(intemper-37)*255/(55-37)).toFixed()+")";
								  } else { if (intemper>=55) {jrrgb="(255,0,0)";}}}} 
	return jrrgb;}

No a to bych potřeboval nějak dostat do toho kódu du nahoře či vyřešit v HA nějak jinak - a tady jsem zase s tou syntaxi v koncích Naťukněte mě zase někdo prosím ?