Floorplan for Home Assistant

Hey @pkozul!
This project you made is awesome!
However, when I click a light, would it be possible to toggle its state, instead of opening the device’s id card?

Hey @pkozul,

Love your project!

I’m using the Home-Assistant IOS app with the latest version of your project. But it’s giving me the "Login attempt or request with invalid authentication from " error everytime the floorplan statecard is loaded.

Does anyone else experience this issue with the latest IOS app?

Incredible work. I just read all 240+ posts and just want to say thanks. At this point I don’t have enough sensors to implement on my home, but interested in trying something for remote in my living room. Just being able to make more customizable UIs that are vector based and scale based on screen is awesome. Thanks.

This looks awesome! Would you mind sharing your SVG files? I would love to use the same colours and icons on my floorplan.

Hi there. Have a look at post 223. Toggling state is supported.

1 Like

Hi John. There have been some great SVGs showcased in this thread. Recently, I (re)created my floorplan from scratch using Inkscape. You can see it below. The GitHub repo now contains this new version of my SVG.

9 Likes

I’ve had a live floorplan in my home automation software for a bit, never quite got around to making the motion sensors show some visual indicator (wanted to do pulsating waves where the motion sensor was located).

I’ve been searching long and wide for some easily exportable floorplan format that hopefully was assisted by some better made app, but never found anything. A lot of the blueprint style floorplans ruin it as a visually appeasing simple floorplan.

Also wanted to put in occupant sensing via closest beacon reading if the service were running on their phone.

I think the pulsing/flashing indicator would be cool. I like the summary to the side as well, especially for the occupants.

I’m having trouble getting the floor plan set up in my configuration. I initially suspected that it had something to do with my .svg file that I created in Inkspace, but I created a very simple floorplan in inkspace with only a few entities to test my setup and it still failed. I can see “floorplan” in my sidebar, but when I click on it I only see the loading ring. I tried using the F12/F5 trick in Chrome and I don’t receive any errors, but I do receive a warning that says “HTML element is ignored in shadow tree.”. Below is my current HomeAssistant configuration. Any suggestions? I’ve tried just about everything and can’t seem to my floor plan to show up in HA. Love the project and would really like to find a way to get this working.

My HomeAssistant Setup

Hi John, I don’t mind sharing but my file has drop shadows and other styling… do you still want it?

1 Like

Yes please

Can you write a small howto on github? Of do we need to look into the old version?

Thanks,
Frank

OK, finally got around to it. Doco is now on GitHub:

11 Likes

Great! Thanks!

i try to create a floorplan but i totally fail :stuck_out_tongue: i dunno where to start and by trying to download an open the svg it doesnt work. Are there any hints how to create such a plan ?

I’m not sure if I understand your question but here I go.
If by failing “to create a floorplan” you mean creating the SVG file, I’ve read somewhere before that there are people that make this files if you provide them a scanned image of your house and some money.
If by failing “to create a floorplan” you mean setting up the component, I’ve successfully done it 10 minutes ago for the “custom panel” option just by following the doco given by @pkozul
I haven’t done any modification to @pkozul 's files up to now. This is the prove :slight_smile:

So keep asking, I’m ready to help as much as I can.

1 Like

I Indeed mean to create those floorplans with Inscape. I dunno how to proceed to make my house floor plan . Setting everything up should be no problem

You could try with cloud.smartdraw.com there is a 7 days trial and it’s fairly simple to use if you use architectural floor plan.
You can then export them as SVG file.

1 Like

Oh, then I cannot provide any help.
And yes, the component is pretty easy to set up. Thanks @pkozul !

1 Like

thanks so far … let me check this out :slight_smile: