@kotrfa asked me to share the picture card on my home assistant dashboard, so here it goes:
Picture-elements card - picture
code for the picture elements card:
type: picture-elements
image: local/images/wtw_icons2.png
elements:
- type: state-label
entity: sensor.huidig_inlaatluchtvolume
style:
top: 59%
left: 73%
color: black
- type: state-label
entity: sensor.huidig_uitlaatluchtvolume
style:
top: 59%
left: 27%
color: black
- type: state-label
entity: sensor.binnen_aanzuig_temperatuur
style:
top: 20%
left: 92%
color: darkred
- type: state-label
entity: sensor.binnen_aanzuig_luchtvochtigheid
style:
top: 28%
left: 92%
color: '#4171b1'
- type: state-label
entity: sensor.binnen_uitblaas_temperatuur
style:
top: 77%
left: 92%
color: darkred
- type: state-label
entity: sensor.binnen_uitblaas_luchtvochtigheid
style:
top: 85%
left: 92%
color: '#4171b1'
- type: state-label
entity: sensor.buiten_aanzuig_temperatuur
style:
top: 20%
left: 14.5%
color: '#4171b1'
- type: state-label
entity: sensor.buiten_humidity
style:
top: 26%
left: 14.5%
color: '#4171b1'
- type: state-label
entity: sensor.buiten_uitblaas_temperatuur
style:
top: 77%
left: 14.5%
color: '#4171b1'
- type: state-label
entity: sensor.buiten_uitblaas_luchtvochtigheid
style:
top: 85%
left: 14.5%
color: '#4171b1'
- type: state-label
entity: sensor.bypass_status
prefix: 'Bypass: '
style:
top: 26%
left: 50%
color: black
- type: state-label
entity: sensor.rendement
prefix: 'η= '
style:
top: 72%
left: 50%
color: black
- type: state-label
entity: sensor.filter_wissel_in
prefix: 'Filterwissel in '
suffix: agen
style:
top: 92%
I use a DHT22 for the suction house side, so this temperature and humidity is normally not available.
Sorry, most of it is in Dutch language.
Also i calculate dewpoint from this suction temperature and humidity with esphome code
And the “performance” (rendement in dutch) in the picture card is also a calculation between suction side house, exhaust side house and suction side outside temperature
Here is the complete code for the vertical stack including the 4 ventilation stands.
type: vertical-stack
cards:
- type: picture-elements
image: local/images/wtw_icons2.png
elements:
- type: state-label
entity: sensor.huidig_inlaatluchtvolume
style:
top: 59%
left: 73%
color: black
- type: state-label
entity: sensor.huidig_uitlaatluchtvolume
style:
top: 59%
left: 27%
color: black
- type: state-label
entity: sensor.binnen_aanzuig_temperatuur
style:
top: 20%
left: 92%
color: darkred
- type: state-label
entity: sensor.binnen_aanzuig_luchtvochtigheid
style:
top: 28%
left: 92%
color: '#4171b1'
- type: state-label
entity: sensor.binnen_uitblaas_temperatuur
style:
top: 77%
left: 92%
color: darkred
- type: state-label
entity: sensor.binnen_uitblaas_luchtvochtigheid
style:
top: 85%
left: 92%
color: '#4171b1'
- type: state-label
entity: sensor.buiten_aanzuig_temperatuur
style:
top: 20%
left: 14.5%
color: '#4171b1'
- type: state-label
entity: sensor.buiten_humidity
style:
top: 26%
left: 14.5%
color: '#4171b1'
- type: state-label
entity: sensor.buiten_uitblaas_temperatuur
style:
top: 77%
left: 14.5%
color: '#4171b1'
- type: state-label
entity: sensor.buiten_uitblaas_luchtvochtigheid
style:
top: 85%
left: 14.5%
color: '#4171b1'
- type: state-label
entity: sensor.bypass_status
prefix: 'Bypass: '
style:
top: 26%
left: 50%
color: black
- type: state-label
entity: sensor.rendement
prefix: 'η= '
style:
top: 72%
left: 50%
color: black
- type: state-label
entity: sensor.filter_wissel_in
prefix: 'Filterwissel in '
suffix: agen
style:
top: 92%
left: 50%
color: black
- type: horizontal-stack
cards:
- type: custom:button-card
name: Afwezig
styles:
card:
- height: 150px
icon: mdi:fan-auto
size: 75%
show_state: true
state:
- operator: template
value: |
[[[
return states['number.ventilatie_stand'].state == "0.0"
]]]
color: darkcyan
tap_action:
action: call-service
service: number.set_value
service_data:
value: 0
entity_id: number.ventilatie_stand
- type: custom:button-card
name: Stand1
styles:
card:
- height: 150px
icon: mdi:fan-speed-1
size: 75%
show_state: true
state:
- operator: template
value: |
[[[
return states['number.ventilatie_stand'].state == "1.0"
]]]
color: darkcyan
- operator: default
tap_action:
action: call-service
service: number.set_value
service_data:
value: 1
entity_id: number.ventilatie_stand
- type: custom:button-card
name: Stand2
styles:
card:
- height: 150px
icon: mdi:fan-speed-2
size: 75%
show_state: true
state:
- operator: template
value: |
[[[
return states['number.ventilatie_stand'].state == "2.0"
]]]
color: darkcyan
tap_action:
action: call-service
service: number.set_value
service_data:
value: 2
entity_id: number.ventilatie_stand
- type: custom:button-card
name: Stand3
styles:
card:
- height: 150px
icon: mdi:fan-speed-3
size: 75%
show_state: true
state:
- operator: template
value: |
[[[
return states['number.ventilatie_stand'].state == "3.0"
]]]
color: darkcyan
tap_action:
action: call-service
service: number.set_value
service_data:
value: 3
entity_id: number.ventilatie_stand
- type: entity
entity: sensor.power_14
state_color: false
name: power
icon: mdi:power-socket-eu
- type: history-graph
hours_to_show: 24
entities:
- entity: sensor.woonkamer_co2
- entity: sensor.slaapkamer_co2
- entity: sensor.badkamer_co2
- entity: sensor.zolder_co2