tpbillund
(Tpbillund)
January 9, 2021, 8:04am
1
Hi
I have made a 3D plan over my house in Sweet Home 3D, and now i’m playing with it in Home Assistant (Layout).
I have turned the floorplan 45Degreeds, so now I have two white area in the two top corners.
What I want, but can’t see how to do, is that in the left top corner I want the weather symbol/icon from today, from the weather.home sensor, and then in the right top corner, I want the weather symbol/icon fore tomorrow.
I have tried to use the state-icon and icon inside the picture-element, but it does not work.
My yaml code fore the floorplan is:
cards:
- type: picture-elements
elements:
- type: state-label
entity: sensor.badevarelse_temperature
prefix: 'Bade Temperatur '
style:
top: 50%
left: 50%
font-size: 20px
- type: 'custom:weather-forecast'
entity: weather.hjem
show_forecast: true
style:
top: 60%
left: 50%
image: /local/images/3DFloorplan/Hoejen26_3.png
I can see that in “development tools and Current entities” here I have the weather sensor and can see the condition for today and tomorrow, as I also can see the temperature: 0.3, humidity: 97 and pressure: 1022, fore today and tomorrow.
But is it possible to add/show/display these informations on the picture-element floorplan, and get the conditions as a weather icon/symbol, if yes how ?
OzGav
(Oz Gav)
January 29, 2021, 11:40am
2
OK I am doing this with the latest version of floorplan so some of the code may be different for you but you should get the general idea:
- name: Weather Today Icon
entities:
- input_text.current_wx_icon
state_action:
action: call-service
service: floorplan.image_set
service_data: '/local/icons/weather_icons/animated/${entity.state}.svg?v=6"'
- name: Future Weather Icon
entities:
- sensor.bom_brisbane_icon_1
- sensor.bom_brisbane_icon_2
- sensor.bom_brisbane_icon_3
state_action:
action: call-service
service: floorplan.image_set
service_data: |
>
var imageName = '';
switch (entity.state) {
case 'sunny': imageName = 'day'; break;
case 'clear': imageName = 'clear-day'; break;
case 'mostly-sunny': imageName = 'fair-day'; break;
case 'partly-cloudy': imageName = 'cloudy-day-3'; break;
case 'cloudy': imageName = 'cloudy'; break;
case 'light-rain': imageName = 'rainy-2'; break;
case 'wind': imageName = 'wind'; break;
case 'windy': imageName = 'wind'; break;
case 'dust': imageName = 'haze'; break;
case 'fog': imageName = 'fog'; break;
case 'showers': imageName = 'rainy-5'; break;
case 'rain': imageName = 'rainy-6'; break;
case 'rainy': imageName = 'rainy-6'; break;
case 'storm': imageName = 'scattered-thunderstorms'; break;
case 'stormy': imageName = 'scattered-thunderstorms'; break;
case 'light-showers': imageName = 'rainy-5'; break;
case 'light-shower': imageName = 'rainy-5'; break;
case 'heavy-showers': imageName = 'rainy-7'; break;
case 'heavy-shower': imageName = 'rainy-7'; break;
case 'clear-day': imageName = 'clear-day'; break;
case 'clear-night': imageName = 'clear-night'; break;
case 'partly-cloudy-day': imageName = 'partly-cloudy-day'; break;
case 'partly-cloudy-night': imageName = 'partly-cloudy-night'; break;
case 'hail': imageName = 'severe-thunderstorm'; break;
case 'lightning': imageName = 'thunder'; break;
case 'thunderstorm': imageName = 'thunder'; break;
default: imageName = 'weather_sunset'; break;
}
return '/local/icons/weather_icons/animated/' + imageName + '.svg?v=1';
and I use this automation to set the current day’s icon:
- alias: Track Weather Icon Day vs Night
mode: restart
trigger:
- platform: state
entity_id: sun.sun
- platform: state
entity_id: sensor.bom_brisbane_icon_0
action:
- service: input_text.set_value
data_template:
entity_id: input_text.current_wx_icon
value: >
{% if is_state('sensor.bom_brisbane_icon_0', 'sunny') %} day
{% elif is_state('sensor.bom_brisbane_icon_0', 'clear') and is_state('sun.sun', 'below_horizon') %} clear-night
{% elif is_state('sensor.bom_brisbane_icon_0', 'clear') and is_state('sun.sun', 'above_horizon') %} clear-day
{% elif is_state('sensor.bom_brisbane_icon_0', 'mostly-sunny') %} fair-day
{% elif is_state('sensor.bom_brisbane_icon_0', 'partly-cloudy') and is_state('sun.sun', 'above_horizon') %} cloudy-day-3
{% elif is_state('sensor.bom_brisbane_icon_0', 'partly-cloudy') and is_state('sun.sun', 'below_horizon') %} cloudy-night-3
{% elif is_state('sensor.bom_brisbane_icon_0', 'cloudy') %} cloudy
{% elif is_state('sensor.bom_brisbane_icon_0', 'light-rain') %} rainy-2
{% elif is_state('sensor.bom_brisbane_icon_0', 'wind') %} wind
{% elif is_state('sensor.bom_brisbane_icon_0', 'windy') %} wind
{% elif is_state('sensor.bom_brisbane_icon_0', 'dust') %} haze
{% elif is_state('sensor.bom_brisbane_icon_0', 'fog') %} fog
{% elif is_state('sensor.bom_brisbane_icon_0', 'showers') %} rainy-5
{% elif is_state('sensor.bom_brisbane_icon_0', 'rain') %} rainy-6
{% elif is_state('sensor.bom_brisbane_icon_0', 'rainy') %} rainy-6
{% elif is_state('sensor.bom_brisbane_icon_0', 'storm') %} scattered-thunderstorms
{% elif is_state('sensor.bom_brisbane_icon_0', 'stormy') %} scattered-thunderstorms
{% elif is_state('sensor.bom_brisbane_icon_0', 'light-showers') %} rainy-5
{% elif is_state('sensor.bom_brisbane_icon_0', 'light-shower') %} rainy-5
{% elif is_state('sensor.bom_brisbane_icon_0', 'heavy-showers') %} rainy-7
{% elif is_state('sensor.bom_brisbane_icon_0', 'heavy-shower') %} rainy-7
{% elif is_state('sensor.bom_brisbane_icon_0', 'clear-day') %} clear-day
{% elif is_state('sensor.bom_brisbane_icon_0', 'clear-night') %} clear-night
{% elif is_state('sensor.bom_brisbane_icon_0', 'partly-cloudy-day') %} partly-cloudy-day
{% elif is_state('sensor.bom_brisbane_icon_0', 'partly-cloudy-night') %} partly-cloudy-night
{% elif is_state('sensor.bom_brisbane_icon_0', 'hail') %} severe-thunderstorm
{% elif is_state('sensor.bom_brisbane_icon_0', 'lightning') %} thunder
{% elif is_state('sensor.bom_brisbane_icon_0', 'thunderstorm') %} thunder
{% else %} weather_sunset
{% endif %}
2 Likes
chris2172
(Christopher Wilmot)
June 14, 2023, 11:47am
3
Thank you for this and it Still works.
Just need to find some cool animated weather images.
OzGav
(Oz Gav)
June 14, 2023, 12:02pm
4
1 Like