Floorplan for Home Assistant

[Fezile]

I am currently new to Home Assistant which I have just done a clean installation on a Raspberry with Jessie. Your advice on how to further proceed will be highly appreciated:

1. I notice that the Home Assistant directory does not contain a “www/custom_ui”. Do I have to create this directory to insert the floorplan subdirectory and its required files?
2. Do I replace the “/local” in “/local/custom_ui/floorplan/floorplan.svg” with the actual path of “/var/opt/home_assistant”? and similarly for “/local/custom_ui/floorplan/floorplan.css”?
3. Do I need to load any files/dependencies other than “Floorplan” files from this repo to get it to work?

[keithh666 (Keith Hull)]

1. yes, create your own www/custom_ui dir’s
2. local is www dir of your homeassistant dir so should remain unchanged
3. you can add icons etc but I find it best to embed them in the svg when you create it that way you don’t need to worry about file locations.

Hope that helps, any other questions fire away

[timseebeck]

Just to encourage other people: if I succeeded, you can. Not too many sensors and not so beautiful as other previously posted but here it is

Next step: try to integrate my covers.

[pkozul (Petar Kozul)]

Looks great!

[mcfrojd]

Finally got around to setup my floor plan.
Awesome feature! You rock @pkozul

Now i need some more sensors
Green area = Motion Sensor Not Triggered

[touliloup (Romain)]

@mcfrojd could you make your svg file available? I tried but it’s somehow not clear how to create it for me, your svg would be a good starting point

[mcfrojd]

@touliloup

could you make your svg file available?

floorplan.svg

Here you go…
(Updated the dropboxfile)

[touliloup (Romain)]

Thanks

[CCOSTAN]

Side question @mcfrojd, What is the MDI Icon Index link?

[mcfrojd]

@CCOSTAN

Side question @mcfrojd, What is the MDI Icon Index link?

MDI Icons for Home Assistant Index

Hi Folks, I’ve mentioned in a few other threads that I had an idea for creating an index of HA related material design icons. There are so many icons on MDI site that it can be challenging to find what you want. Whilst there are many icons that are a direct fit for what I want, I also end up re-purposing some that are meant for a completely different use. So I trawled MDI and listed and categorised every icon that I thought can be useful in an HA context, and bundled them into a package that…

[frekel (Frank)]

I am a happy user!!!
off to create the first floor and attic

[frekel (Frank)]

What i did:

1. I created the basic layout of my house in floorplanner.com.
2. Made a screenshot of the layout (the export of floorplanner.com is very low)
3. Imported the screenshot in Inkscape. (create layers <-- search youtube for more info)
4. Look up the icons you need at https://materialdesignicons.com/
5. Right click the icon you need
6. save the icon as a compressed svg
7. Import the saved svg in Inkscape (Ctrl + i)
8. Repeat 4 to 7 for every icon
9. Positions the icons and give them the names of the entities of home-assistant!

Thats all folks!!

[CCOSTAN]

Just adding my work in progress to the inspirational mix! Really Great project! I was able to add input_booleans, Covers and climates. Really amazing!

Source files can be found in my Repo.

Floorplan card for the nest protects

[frekel (Frank)]

Anyone any luck with showing the status of webcams/cameras?
Mine stay without the entity class…

[Bram_Kragten]

I too would love to have your file! I almost finished recreating your styling in Inkscape, but then Inkscape crashed and of course, I did not save it…

[iansampaio (Ian)]

@Bram_Kragten and @john1 here is my file. I’ve removed some of the effects which are not supported by SVG… I hope it still works!

20170615-Floor-plan.zip

[Bram_Kragten]

Thanks! I’ll look into it tonight!

[Bram_Kragten]

@pkozul Would it be possible to have tabs on the top of the panel, the same as the States panel, so I can have a tab for every floor? Does HASS support this? And could you point me in the right direction? Not at home in the HASS front end…

[Fezile]

I am struggling to get floorpan to work and have been trying for the last 2 days without success. I am new to Home Assistant and have done a clean installation of Hassbian on a Raspberry.

1. Do I copy the files of the repo into the “/srv/homeassistant/” or “/home/homeassistant/.homeassistant” directories?
2. There are no “www” directories. Do I create the same directory structure as the repo?
3. Could anyone please provide me with a basic configuration.yaml, floorplan.svg, floorpan.css, files etc. with some instructions on what directories needs to be created and where these files needs to be placed. I would truly appreciate any assistance. It is not out of laziness, I have tried to follow the instructions on GitHub and have not been successful.
4. When browsing I am using Safari version 9.0.3

I am sure that if I can get a minimalist setup working and be able to view the svg file, I could take it further.

[timseebeck]

Hi @Fezile

My setup is with “Option 2: Floorplan custom panel”. I hope the next figure will answer your questions 1 and 2. It is the directory tree of folders and files of this component:

As you can see, three files are in the last folder (floorplan) and examples for these can be found in the Github’s repository that you can download.

The file floorplan.yaml should be placed in /home/homeassistant/.homeassistant directory. There is also an example in github. For the custom panel it is also needed a file in its corresponding folder as you can see here:

And again there is an example file in github.
Finally, the part inside configuration.yaml

panel_custom: 
  - name: floorplan
    sidebar_title: Floorplan
    sidebar_icon: mdi:home
    url_path: floorplan
    config: !include floorplan.yaml

I hope I have remembered everything. I don’t know for the “Custom State Card” option, but for the “Custom panel” it is pretty easy. Good luck and ask if you get stuck!