It is possible to have two or more svg images in floorplan? And then call them from main floorplan.svg using inkscape/object properties/interactivity/onclick with javascript??
1 Like
I’m interested in this as well.
My current solution is another svg file, custom panel for it and using weblink to switch between two. It was a quick try yesterday night. And I don’t like it at all. If someone wanted x number of images bazillion panels would flood the ui, plus using weblink opens pop up with statistic first, I have to click the link in pop up to get to the second image. Nail to the coffin is that it opens second image in new browser window.
There has to be a better way and I’ll keep trying today after work.
But if someone from grandmasters here can help, I’ll start praying for their well being each morning and night.
1 Like
It seems like my animations have stopped working for my lights. I can still click on the icons to toggle the lights but the colour doesn’t change anymore. It worked before the update and I haven’t changed anything.
groups:
- name: Lights
entities:
- light.hue_go_1
states:
- state: 'on'
class: 'light-on'
- state: 'off'
class: 'light-off'
action:
domain: homeassistant
service: toggle
In CSS
.light-on .light-circle {
stroke: #656565 !important;
fill: #ffe582 !important;
}
.light-on .light-strike {
opacity: 0.0 !important;
}
.light-on .light-room {
fill: #f4e032 !important;
-webkit-animation: room_fade_in 4s 1 forwards !important;
}
.light-on .light-icon {
stroke: #656565 !important;
fill: #656565 !important;
}
.light-on .light-detail {
-webkit-animation: light_blink 2s infinite alternate !important;
}
.light-on .light-icon-fill {
fill: #ffffff !important;
}
.light-off .light-circle {
stroke: #b1b1b1 !important;
}
.light-off .light-icon {
stroke: #b1b1b1 !important;
}
.light-off .light-icon-fill {
fill: #ffffff !important;I was testing the Floor Plan, simply following the instruction. I see multiple FloorPlan images rendered once switching between the Views. Also clicking an entity brings up a popup with the floor plan and json config. Is this a normal behaviour?
I have same issue and I can’t find a way to solve it
Is there a way to reference the state of a different entity when formatting an entity? For example, I’m displaying the indoor temperature using the temperature entity of my thermostat. I’d like to change the color of the temperature entity based on the current state of the HVAC system (off, heating, cooling), which is a different entity. Here’s what I tried knowing it likely wouldn’t work:
- name: Inside Temp
entities:
- sensor.dining_room_thermostat_temperature
text_template: '${entity.state ? Math.ceil(entity.state) + "°" : "unknown"}'
class_template: '
if (is_state('sensor.dining_room_thermostat_hvac_state', 'off')
return "roboto-500-green";
else if (is_state('sensor.dining_room_thermostat_hvac_state', 'cooling')
return "roboto-500-blue";
else
return "roboto-500-red";
'After a bit of trial and error I solved my own problem. I created a new sensor in HA using this code:
hvac_temp_status:
friendly_name: "Indoor Temp and Status"
value_template: >-
{{ states.sensor.dining_room_thermostat_temperature.state }}° {{ states.sensor.dining_room_thermostat_hvac_state.state }}
I then used this in floorplan.yaml:
- name: Inside Temp
entities:
- sensor.hvac_temp_status
text_template: '${entity.state.substring(0,3)}'
class_template: '
var hvacstate = entity.state.substring(4);
if (hvacstate = "off")
return "roboto-300-green";
else if (hvacstate = "cooling")
return "roboto-300-blue";
else
return "roboto-300-red";
'
This allows me to display the indoor temperature, but have it colored based on the status of the HVAC (off, cooling, heating).
2 Likes
Hello community
Can anyone please help me with adding an image on my floor plan (to my TV). I have added an image to my svg but it does not display on my floor plan in HA.
I am trying to show an image on my TV when it is turned on.
Am I missing something in the css file?
Thanks
try ctrl+F5 to clear the cache on your browser when you’re looking at your floorplan.
1 Like
I’m having the same issue with the more info dialog, are you able to post the relevant part of your yaml so I can try it?
LCARS! Here is what I have been working on. I’m still far from done, but wanted to put this out there. So far I only have a handful of lights, a couple motion sensors, various temperature / presence sensors and my garage controls hooked in. The buttons on the left toggle groups whereas the lights on the floorplan itself are grouped together and can be toggled by clicking them. So far, so good. Even the wife likes it 
Thanks to @atomicpapa for the inspiration. I saw your post a while ago and decided this was the only way to go!
5 Likes
Glad I could inspire!!! I am super curious though about that round shape to the house!!! Any chance of a real life pic?
Yes, that’s my actual floor plan. We live in a geodesic dome house that we refer to as our Hobbit hole.
3 Likes
Update on my floorplan! I experimented a bit with an isometric view and I think the result looks cool
4 Likes
input_text.floorplan_fp:
config: !include floorplan.yaml
custom_ui_state_card: state-card-floorplan
friendly_name: Floorplan
Just started with floorplan… I get this error
TypeError: a is undefined
URL: http://192.168.0.205:8123/static/webcomponents-lite.js
Line: 129, column: 615
Error: {}
What could it be ?
Anybody already solved this? Totally annoying bug!
@Thorbeen Just updated some of the code to keep in sync with the HA 0.70 changes.
Can you try Floorplan v1.0.10?