Hallo!
Weiß jemand, wie und ob man auf der Mini Graph Card das Diagramm seitlich eingrenzen kann, also so, dass es links und rechts einen einstellbaren quasi ungenutzten Rand hat. Stört mich bei meinem Setting, dass die aktuellen Werte immer “in der Rundung” des Glas-Buttons verschwinden… .
Ich kann dir leider nicht helfen, aber wo hast du diese Glas-Buttons her? Sieht irgendwie nice aus.
Naja, ist vielleicht ein bisschen kindisch verspielt, aber das Normale war mit dann doch zu nüchtern. Wollte ursprünglich nur vier Buttons machen und die SolarWeb-App von Fronius nachmachen. Aber dann kam das Eine zum Anderen. Die Icons liessen sich scheinbar nicht vergrößern oder anders platzieren, da habe ich die in Photoshop ins Hintergrundbildchen mit eingebaut. Dann sah ch, dass man mehrere kleine Graphen reinpacken konnte, dass man die Werte-abhängig einfärben kann… . Ziemlich viel Freiheit.
Ein paar Einschränkungen gibt es offensichtlich aber doch: Innerhalb einer Mini Graph Card geht nur eine Dezimalstellen-Definition, was manchmal blöd ist, wenn man Grad Celsius, kW und Wh vermischt darstellen will. Ebenso gehen “nur” zwei Y-Achsen. Und noch blöder: nur eine Linienbreite für alle Graphen innerhalb einer Karte. Also dünn im Hintergrund die Wechselrichtertemperatur und dick im Vordergrund die Leistung geht nicht. Muss man sich arrangieren.
Einfach mal nach 3D-Buttons googeln, da gibt es Hunderte Quellen.
Mt Card-Mod innerhalb einer template-card die Mini-Graph-card reinsetzen.
In der Card-Mod kann man Schriftarten, Hintergrundbilder etc. definieren.
Kenne aber keine Doku dazu, sonst würde ich hier nicht fragen
type: custom:config-template-card
entities:
- numberinput_number.zeit_seit_letztem_sonnenaufgang
card:
type: custom:mini-graph-card
card_mod:
style: |
ha-card {
background-image: url("/local/images/button_battery.png");
background-size: 100% 100%;
font-family: Arial Black ;
.state__value,
.state__uom {
font-weight: bold;
}
color_thresholds_transition: smooth
color_thresholds:
- value: 0
color: "#ff0000"
- value: 20
color: "#ffae00"
- value: 70
color: "#28901d"
- value: 80
color: "#1a6512"
decimals: 1
name: Akku
line_width: 4
points_per_hour: 50
font_size: 45
hours_to_show: ${ states['input_number.zeit_seit_letztem_sonnenaufgang'].state }
entities:
- entity: sensor.battery_storage_byd_battery_box_premium_hv_state_of_charge
state_adaptive_color: true
show_graph: true
show_state: true
show_fill: true
show_points: true
show_legend: false
line_width: 4
- entity: sensor.byd_battery_box_premium_hv_temperatur
state_adaptive_color: true
unit: °C
color: lightgrey
decimals: 1
show_graph: false
show_state: true
show_points: true
show_legend: false
show_fill: false
line_width: 2
- entity: sensor.byd_speicher_leistung_normalisiert_zweirichtung
state_adaptive_color: true
color: red
show_state: true
show_graph: true
show_points: true
show_legend: false
show_fill: true
line_width: 4
decimals: 0
y_axis: secondary
upper_bound_secondary: 10000
lower_bound_secondary: -10000
1 „Gefällt mir“
Danke dir für die ausführliche Antwort!
Guck ich mir mal näher an 
VG Jan