Tile: cv-energy

[mivola]

Hallo,

ich nutze das cv-energy Widget im Tile Design und habe ein paar Fragen:
image.png
- wie kann ich die Farbe für alle Elemente die sich auf PV beziehen von gelb auf grün ändern?
- wie bekomme ich eine rote Linie nach unten zur WP hin, wenn diese Bezug >0 hat?
- ich nutze das komplexe Beispiel von hier, und dann sieht der Fullscreen etwas verschoben aus:
image.png

Danke und VG
Micha

[peuter]

- wie kann ich die Farbe für alle Elemente die sich auf PV beziehen von gelb auf grün ändern?

Alle Farben sind per CSS-Variable festgelegt und die kannst Du ganz einfach ändern mit folgendem Schnipsel im cv-meta Bereich deiner Config:

<style>
:root {
  --pvColor: #168035;
}
</style>​

Die Namen der Farben fürs Energy-Widget und deren Werte findest Du hier: https://github.com/CometVisu/CometVi...c.scss#L48-L58

- wie bekomme ich eine rote Linie nach unten zur WP hin, wenn diese Bezug >0 hat?

Kann ich nur relativ allgemein beantworten: Die Farbe des Pfeils wird durch die Farbe der Quelle bestimmt (also das Element mit dem connect-to bzw. connect-from). Sieht so aus als ob die Warmepumpe in deinem Fall selbst keine Farbe hätte, bzw. grau ist dementsprechend ist der Pfeil auch grau.

- ich nutze das komplexe Beispiel von hier, und dann sieht der Fullscreen etwas verschoben aus:

Ja das Feature ist noch recht neu und nicht frei von Bugs, und das Thema "Wie zentriere ich Inhalt in einem SVG" stellt sich als deutlich komplizierter dar, als ich das ursprünglich gedacht habe.

[mivola]

Alle Farben sind per CSS-Variable festgelegt und die kannst Du ganz einfach ändern mit folgendem Schnipsel im cv-meta Bereich deiner Config:

<style>
:root {
--pvColor: #168035;
}
</style>​

Das funktioniert sehr gut, danke!

Kann ich nur relativ allgemein beantworten: Die Farbe des Pfeils wird durch die Farbe der Quelle bestimmt (also das Element mit dem connect-to bzw. connect-from). Sieht so aus als ob die Warmepumpe in deinem Fall selbst keine Farbe hätte, bzw. grau ist dementsprechend ist der Pfeil auch grau.

Das verstehe ich leider nicht so ganz. Ich habe mir das mal in der Developer Console angeschaut. Und ich denke, es fehlt dafür (hier am Beispiel Wallbox) eine entsprechende CSS-Klasse (je nachdem ob der Verbrauch >0 ist oder nicht) an dem Pfeil analog "grid-consume"/"grid-inject".

image.png
image.png

Oder ganz felxibel: für meine Config:

    <cv-power-entity id="oWB" type="charger" connect-from="house" row="1" column="0">
      <cv-address transform="DPT:9.024" mode="read">12/1/100</cv-address>
    </cv-power-entity>​

könnte man dann "oWB-consume" setzen. Damit könnte man dann doch entsprechend mit CSS die Farbe setzen, oder?

Ja das Feature ist noch recht neu und nicht frei von Bugs, und das Thema "Wie zentriere ich Inhalt in einem SVG" stellt sich als deutlich komplizierter dar, als ich das ursprünglich gedacht habe.

OK, kein Problem. Ist sicherlich auch keine hohe Prio...

[peuter]

Leider lassen sich die Pfeilspitzen nicht per CSS färben, das würde die Sache deutlich einfacher machen. Momentan muss da für jede Farbe ein eigener Marker erzeugt werden und dieser kann dann benutzt werden. Daher ist das was Du vorhast als reine CSS Lösung technisch nicht möglich.

Aber ich habs jetzt verstanden und zum Glück ist die Lösung relativ simpel. Der Grund warum das im moment keine Farbe hat, ist das Verbraucher momentan kein vordefiniertes Styling haben. Wenn Du das Rot haben willst kannst Du einfach das vorhandene ' styling="tile-grid-power"' nehmen (wobei das erst bei Werte > 2 anfängt rot zu werden, das sollte bei einem Charger und einer Wärmepumpe kein Problem sein, das soll einfach flackern verhindern wenn das um den 0-Wert rotiert). Du kannst natürlich auch ein eigenes Styling definieren und nutzen.

[mivola]

Aber ich habs jetzt verstanden und zum Glück ist die Lösung relativ simpel. .... einfach das vorhandene ' styling="tile-grid-power"' nehmen

Das funktioniert in der Tag sehr einfach & gut!
Danke!!

[mivola]

Noch 2 Fragen zum UI/Styling:
- cv-energy-entity: wird ja standardmäßig mit 2 Nachkommastellen angezeigt. Mit format="%.1f kWh" kann ich das ändern, müsste es aber für alle Elemente einzeln machen. Gibt es eine globale Möglchkeit dies zu ändern?
- für Autarkie/EVQuote würde ich evtl gern cv-svg-round-value statt cv-svg-text-value nutzen. Leider finde ich keine passenden Icons - ist es möglich stattdessen einen Text in die Mitte des Kreises zu platzieren?

Danke
Micha

[peuter]

- cv-energy-entity: wird ja standardmäßig mit 2 Nachkommastellen angezeigt. Mit format="%.1f kWh" kann ich das ändern, müsste es aber für alle Elemente einzeln machen. Gibt es eine globale Möglchkeit dies zu ändern?

Nein gibt es nicht, du könntest Dir Dein eigenes Widget definieren, was dass dann so macht. Aber ich glaube das Format einfach immer manuell zu setzen dürfte weniger aufwändig sein. Du hast ja nicht 500 Stück von diesen Dingern.

- für Autarkie/EVQuote würde ich evtl gern cv-svg-round-value statt cv-svg-text-value nutzen. Leider finde ich keine passenden Icons - ist es möglich stattdessen einen Text in die Mitte des Kreises zu platzieren?

Das geht nicht, die gibts nur mit Icon.

[mivola]

OK, alles klar. Danke!