Faecon
(Jo)
1
this is my config.yaml
sensor:
- platform: template
sensors:
dressingkleur_template:
friendly_name: "Temperature Dressingkleur template"
unit_of_measurement: 'degrees'
value_template: "{{ states.sensor.temperature_158d00022c8b2b.state }}"
so this is in my floorplan.yaml
groups:
- name: Temp Sensors
entities:
- sensor.dressingkleur_template
text_template: '${entity.state ? Math.round(entity.state) + "°C" : "undefined"}'
class_template: '
var temp = parseFloat(entity.state.replace("°", ""));
if (temp < 15)
return "temp-in-very-low";
else if (temp < 20)
return "temp-in-low";
else if (temp < 21)
return "temp-in-good";
else if (temp < 23)
return "temp-in-high";
else
return "temp-in-too-high";
If I look in HA to the states the sensor.dressingkleur.template is 23.4. Shouldn’t that be “temp-in-too-high” ?
petro
(Petro)
3
shouldn’t this line be a > instead of a '?
class_template: >
Faecon
(Jo)
4
it returns temperature . But the return value has to change colour by css. But nothing happens …
Faecon
(Jo)
5
in my css I have : .temp-in-too-high {
fill: #333300 !important;
}
and my object (circle) has id : sensor.dressingkleur_template but nothing changes 
petro
(Petro)
6
again, I’m fairly certain multiline templates require the arrow not the quote to start it off.
Single line templates require quotes, multi line require arrow. See example from my config:
light:
custom_ui_state_card: state-card-custom-ui
extra_data_template: >
if (attributes.power_consumption) return attributes.power_consumption + 'W'; return null;
So yours should look like this:
groups:
- name: Temp Sensors
entities:
- sensor.dressingkleur_template
text_template: '${entity.state ? Math.round(entity.state) + "°C" : "undefined"}'
class_template: >
var temp = parseFloat(entity.state.replace("°", ""));
if (temp < 15)
return "temp-in-very-low";
else if (temp < 20)
return "temp-in-low";
else if (temp < 21)
return "temp-in-good";
else if (temp < 23)
return "temp-in-high";
else
return "temp-in-too-high";
1 Like
Faecon
(Jo)
7
Ok, thanks. i’ll test it tonight
Yes @petro is correct all of my multiple line template use the arrow.
1 Like
Faecon
(Jo)
9
Hey guys,
It was the > . So thank you al for helping me out. The only thing that doesnt work is a gradient…
I have this in my css …
.temp-in-high {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#00ffff+0,2989d8+11,aa0000+46 */
background: #00ffff; /* Old browsers */
background: -moz-linear-gradient(left, #00ffff 0%, #2989d8 11%, #aa0000 46%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #00ffff 0%,#2989d8 11%,#aa0000 46%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #00ffff 0%,#2989d8 11%,#aa0000 46%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffff', endColorstr='#aa0000',GradientType=1 ); /* IE6-9 */
}
What I see is a gradient, but not moved to one or another side.
if I use
.temp-in-too-high {
fill: #f00808 !important;
}
it works
1 Like
Faecon
(Jo)
10
Kleine Kamer does not work. The temperature is ok, but it does not change colour. Can you see the problem ? I just copied the code from my “dressing”
floorplan.yaml
Dressing
- name: Temp Sensors
entities:
- sensor.dressingkleur_template
text_template: '${entity.state ? Math.round(entity.state) + "°C" : "undefined"}'
class_template: >
var temp = parseFloat(entity.state.replace("°", ""));
if (temp < 15)
return "temp-in-very-low";
else if (temp < 20)
return "temp-in-low";
else if (temp < 21)
return "temp-in-good";
else if (temp < 23)
return "temp-in-high";
else
return "temp-in-too-high";
Kleine Kamer
- name: Temp Sensors
entities:
- sensor.kleinekamerkleur_template
text_template: '${entity.state ? Math.round(entity.state) + "°C" : "undefined"}'
class_template: >
var temp = parseFloat(entity.state.replace("°", ""));
if (temp < 15)
return "temp-in-very-low";
else if (temp < 20)
return "temp-in-low";
else if (temp < 21)
return "temp-in-good";
else if (temp < 23)
return "temp-in-high";
else
return "temp-in-too-high";
and config.yaml
> sensor:
> - platform: template
> sensors:
> dressingkleur_template:
> friendly_name: "Temperature Dressingkleur template"
> unit_of_measurement: 'degrees'
> value_template: "{{ states.sensor.temperature_158d00022c8b2b.state }}"
>
> - platform: template
> sensors:
> kleinekamerkleur_template:
> friendly_name: "Temperature kleinekamerkleur template"
> unit_of_measurement: 'degrees'
> value_template: "{{ states.sensor.fibaro_system_fgms001zw5_motion_sensor_temperature.state }}"
Hello guys,
I added my sonar panels on a floorplan, and want to change their colors by increased power output, but the colors don’t change. What am I doing wrong?
- name: Zonnepaneel info
entities:
- sensor.goodwe_status
states:
- state: 'Normal'
class: 'zonnepaneelinfo-normal'
- state: 'Offline'
class: 'zonnepaneelinfo-offline'
- state: 'Unknown'
class: 'zonnepaneelinfo-warning'
- name: Zonnepanelen
entities:
- sensor.goodwe_emomenteel
text_template: '${entity.state ? Math.round(entity.state) + "kW" : "undefined"}'
class_template: >
var power = parseFloat(entity.state.replace("W", ""));
if (power = 0)
return "power_out";
else if (power < 1.0)
return "power_1000";
else if (power < 2.0)
return "power_2000";
else if (power < 3.0)
return "power_3000";
else if (power < 4.0)
return "power_4000";
else
return "power_5000";
/* Zonnepalen */
.power_out {
fill: #2F383D !important;
}
.power_1000 {
fill: #FFD500 !important;
}
.power_2000 {
fill: #00FF4D !important;
}
.power_3000 {
fill: #D1FF00 !important;
}
.power_4000 {
fill: #FFD500 !important;
}
{
.power_5000 {
fill: #FF7000 !important;
}
/* Zonnepaneel info */
.zonnepaneelinfo-normal {
fill: #99ea44 !important;
}
.zonnepaneelinfo-offline {
fill: #808080 !important;
}
.zonnepaneelinfo-warning {
fill: #ff0000 !important;
}
