Ankündigung

Einklappen
Keine Ankündigung bisher.

Parameter "color" in basic.stateswitch mit Definition aus visu.css

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • wopper
    antwortet
    Danke Tom! Ich möchte aber nicht den Text einfärben, sondern das SVG-Icon. Aus dem Grund habe ich es mit dem stateswitch probiert.

    Einen Kommentar schreiben:


  • Tom Bombadil
    antwortet
    Wenns nicht unbedingt ein Switch sein muss, sondern nur um die Anzeige geht, dann ja: Nimm basic.print mit thresholds.

    Beispiel:
    Code:
    {{basic.print('','raumklima.EG.Sensor.Temperature','%.1f °C','','[20,25]',['deepskyblue,lime,orange'])}}
    Unter 20 blau, 20-24.9 grün ("lime"), ab 25 Orange. Beliebig erweiterbar ...

    /tom
    Zuletzt geändert von Tom Bombadil; 23.12.2019, 18:41.

    Einen Kommentar schreiben:


  • Parameter "color" in basic.stateswitch mit Definition aus visu.css

    Hallo,

    ich nutze basic.stateswitch um die aktuelle Pollen-Vorhersage darzustellen. Dabei werden die Icons je nach Stärke eingefärbt. Soweit funktioniert der unten aufgeführte Code. Allerdings möchte ich die Farbwerte (z.B. #16BB67) nicht fest hinterlegen, sondern über die visu.css einfügen.

    Code:
    {{ basic.stateswitch('A5_Wetter_Pollen.fc1_Hasel', 'A5_Wetter_Pollen.fc1_Hasel.r', 'icon', ['Keine', 'Schwach', 'Mittel', 'Stark', 'Extrem'], 'weather_pollen', '', ['none', 'low', 'moderate', 'high', 'extreme']) }}
    visu.css
    Code:
    .none {
        color: #ececec;
        stroke: #ececec;
        fill: #ececec;
    }
    
    .low {
        color: #16BB67;
        stroke: #16BB67;
        fill: #16BB67;
    }
    
    .moderate {
        color: #EFD930;
        stroke: #EFD930;
        fill: #EFD930;
    }
    
    .high {
        color: #FF7245;
        stroke: #FF7245;
        fill: #FF7245;
    }
    
    .extreme {
        color: #DC3500;
        stroke: #DC3500;
        fill: #DC3500;
    }
    Habt ihr eine Idee, wie ich das Problem lösen kann?

    Vielen Dank!
Lädt...
X