Most folks seem to use Inkscape to edit their svg files. Adobe Illustrator is another option.
I have just upgraded to 0.59.1 and my floor plan on my front end has disappeared, just a white card.
Are there any known issues with 0.59.1 with floorplan or a configuration change ive missed? I couldn’t find anything reported
Ross
2 Likes
The only issue I know of with floor plan like that is on Mozilla Firefox it does work on Chrome. It also does not appear the entities are clickable on iOS platforms either.
hmm ok,
any one got any ideas as to why its suddenly stopped working? Ive made no other changes other than update to 0.59.1. Anything I can do to help work this out? Ive had a look in the logs but nothing in there…
1 Like
What browser are you using?
Safari,
As I say this was working before I upgraded. I checked pointed my Virtual machine so if I roll back it is working again. When I go back to 0.59.1 it shows blank!
Have you added the frontend: latest thing, something to do with js, it may have something to do with it
Could you point me in the right direction for that? I cant seem to find that information on the 0.59.1 page.
It was part of the breaking changes the last one in the list -
Thanks - fixed the bug for me!
frontend:
javascript_version: latest
1 Like
Yep worked for me too! Thank you!
Both of these ways fixed for me
Old broken config : -
frontend:
extra_html_url:
- /local/custom_ui/state-card-floorplan.html
Fixed v1 : -
frontend:
javascript_version: latest
extra_html_url:
- /local/custom_ui/state-card-floorplan.html
Fixed v2 : -
frontend:
extra_html_url:
- /local/custom_ui/state-card-floorplan.html
extra_html_url_es5:
- /local/custom_ui/state-card-floorplan.html
Either of these worked for me. I stuck with V1
Using version 1 of my code above breaks home assistant for Safari browsers - Works fine on firefox, chrome and safari for iOS. Safari Mac however you only get a blue bar at the top. Must be a bug!
I changed to using version 2 and all browsers work and my floorplan on the front end is also working!
Just getting started with the SVG.
Can’t wait to add detail and my components.
Still deciding if showing all floors on one canvas or having a toggle button is idea.
I know i’ll have to toggle cameras/ sensors / media players etc to give them large enough hit-targets anyway
15 Likes
uhhh, I need you to design mine 
looks nice
1 Like
I used this very easy tool to create my .SVG floorplan:
Free option allows you to export an svg. I openend the .svg in chrome and inspected with dev tools to find the id’s of the objects I wanted to modify with sublime text.
Changed the text of the dimensions to the labels I wanted for my cameras and commented out the ones I didn’t want
I did find that If I have the zoom pan enabled then I cannot click through very nicely on a mobile device, On a PC it is excellent. Possibly because of touch/tap/click events interfering.
planningwiz also have a 3D option, hopefully in future we can do FPS type walkthroughs and turn our automations on and off… but that is a dream yet to become a reality
3 Likes
Not sure what I am doing wrong but I still cannot see my floorplan after the recent updates to HA.
I updated my frontend.yaml:
extra_html_url:
- /local/custom_ui/state-card-floorplan.html
extra_html_url_es5:
- /local/custom_ui/state-card-floorplan.html
and also tried the:
javascript_version: latest
extra_html_url:
- /local/custom_ui/state-card-floorplan.html
have F5’d it to death, and tried multiple browsers although Chrome is my default.
Any thoughts?
Have you cleared you cache?
Didn’t work for me till I did that! Try that and see how you get on
Yes I have, but no luck there either. I am not getting any errors that I can see, just blank space.
Does any of this make sense?
I’m just starting out with floorplan but have already hit a snag that I can’t figure out. Is there anything wrong with the following steps that I’ve so far performed please? The error in Chrome on my Mac is:
URIError: http://<my IP>:8123/local/custom_ui/floorplan/lib/floorplan.js?_=1513339943023
cd /home/pi
git clone https://github.com/pkozul/ha-floorplan.git
cd /home/homeassistant/.homeassistant
sudo cp -r ~/ha-floorplan/www/ .
sudo cp -r ~/ha-floorplan/panels/ .
sudo chown -R homeassistant:homeassistant panels/
sudo chown -R homeassistant:homeassistant www/
cat floorplan.yaml
name: Demo Floorplan
image: /local/custom_ui/floorplan/floorplan.svg
stylesheet: /local/custom_ui/floorplan/floorplan.css
warnings:
Within configuration.yaml, I added the following:
frontend:
javascript_version: latest
panel_custom:
- name: floorplan
sidebar_title: Floorplan
sidebar_icon: mdi:home
url_path: floorplan
config:
hide_app_toolbar:
config: !include floorplan.yaml
Permissions look ok:
pi@hassbian:/home/homeassistant/.homeassistant $ ls -al www/custom_ui/floorplan/
total 116
drwxr-xr-x 3 homeassistant homeassistant 4096 Dec 15 12:07 .
drwxr-xr-x 3 homeassistant homeassistant 4096 Dec 15 12:07 ..
-rw-r--r-- 1 homeassistant homeassistant 2261 Dec 15 12:07 floorplan.css
-rw-r--r-- 1 homeassistant homeassistant 61908 Dec 15 12:07 floorplan.svg
-rw-r--r-- 1 homeassistant homeassistant 32955 Dec 15 12:07 ha-floorplan.html
drwxr-xr-x 2 homeassistant homeassistant 4096 Dec 15 12:07 lib
pi@hassbian:/home/homeassistant/.homeassistant $ ls -al www/custom_ui/floorplan/lib/
total 180
drwxr-xr-x 2 homeassistant homeassistant 4096 Dec 15 12:07 .
drwxr-xr-x 3 homeassistant homeassistant 4096 Dec 15 12:07 ..
-rw-r--r-- 1 homeassistant homeassistant 86659 Dec 15 12:07 jquery-3.2.1.min.js
-rw-r--r-- 1 homeassistant homeassistant 51466 Dec 15 12:07 moment.min.js
-rw-r--r-- 1 homeassistant homeassistant 29809 Dec 15 12:07 svg-pan-zoom.min.js
pi@hassbian:/home/homeassistant/.homeassistant $ ls -al floorplan.yaml
-rw-r--r-- 1 homeassistant homeassistant 528 Dec 15 09:38 floorplan.yaml
Running version 0.59.2