Floorplan for Home Assistant

[pkozul (Petar Kozul)]

I believe there is currently an issue with custom state cards…

Need to force refresh before entities show (0.53.)

[eddi89]

hey I posted the solution above and Andrey is working on a fix…

[pkozul (Petar Kozul)]

@Ross_Davey I added the info below to the doco on GitHub. Let me know if it helps in getting your floorplan to show as a state card…

To allow the above file to be served by Home Assistant, add it to the frontend section of your Home Assistant configuration:

frontend:
  extra_html_url:
    - /local/custom_ui/state-card-floorplan.html

[Ross_Davey]

Thank you Pkozul

I have this in place already and its working as a custom panel

Im still having issues with it showing blank on as a state card

[Cpete]

Hitting a bit of a dead end here Can someone point me in the right direction?

I’m trying to improvise a way to use dimmable lights on my floorplan. To achieve this I’m looking at adding two seperate icons for each light. The first to toggle the light when pushed, the second to show the default popup for dimmable light which includes a slider for the level.

I can get both of them working seperately but not together.
If I want to show the info popup I can leave the action blank in my floorplan.yaml

    - name: Lights
      entities:
         - light.lamp_2_level
         - light.lamp_3_level
      states:
        - state: 'on'
          class: 'light-on'
        - state: 'off'
          class: 'light-off'
      action:

This info popup shows a lot of useless info like node id, value id, entity id’s etc but at least it has a slider so it will have to do)

Alternativly I can specify an action which toggles the light

    - name: Lights
      entities:
         - light.lamp_2_level
         - light.lamp_3_level
      states:
        - state: 'on'
          class: 'light-on'
        - state: 'off'
          class: 'light-off'
      action:            
        - service: toggle
          domain: homeassistant 

But in both scenarios I need to assign id = light.lamp_2_level to the icon in the svg.
How can I use two seperate icons both related to the same light but specifying a different action?

Or alternatively, have any of you implemented a better way of handling dimmable lights in your floorplan?

Tnx.

[pkozul (Petar Kozul)]

Hi @Cpete. Can you check my post in the other thread and give that a go?

Video on Floorplan

@atomicpapa Thanks for checking that. Will let this settle for a few days, and then this version can be pushed to the main branch and become the official release. BTW, there is another feature in the new version I should also mention. You can now display a single HA entity in multiple places on your floorplan. This allows you to, for example, expose a single camera in the following ways: as text to display the current state (i.e. ‘idle’) as an icon to show where the camera is mounted on your …

Make sure to grab the latest floorplan file from the ‘camera-images’ branch:

https://raw.githubusercontent.com/pkozul/ha-floorplan/camera-images/www/custom_ui/floorplan/ha-floorplan.html

[atomicpapa (Glenn Morrison)]

How are you getting text to word wrap in an area? I have a sensor that can generate a long text message and would like it to wrap within a certain area. I have tried the flow thing built in to Inkscape, but that doesn’t actually show the message in the defined area. I worked on this most of the night and it is driving me absolutely bonkers.

[namadori]

@atomicpapa check here and the messages below:

Floorplan for Home Assistant

To show more than one line of text you can try this: {{ ( states.sensor.dark_sky_hourly_summary.state | wordwrap(50, true,"§")).split("§")[0]}} Using [0] for the template for the first line of text, [1] for the second line, [2] for the third. The convoluted logic is: wordwrap places a § between words in blocks less than 50 chars (you can use any character that hopefully will never be in the original text) split transform the string in an array of strings splitting on the § char [n] takes …

[atomicpapa (Glenn Morrison)]

Thank you! I got it up and running!

[olloe]

I’m having trouble with the lights. When I press they often don’t respond. I believe it’s the double click issue previously mentioned because sometimes I see them flicker on-off. Some lights are worse than others.
Is this still a problem? Any solution?

[Thorbeen]

@ ferges

This was made with https://home.by.me , a cool & free web application

[hijinx (James)]

Nice. I will have a play!

[carlos.mgr]

How do you export to SVG from home.by.me?

[radinsky]

wow, any chance you can share your code?

[Thorbeen]

I just made a screenshot and used that *png as the background in my SVG file… worked like a charm!

Thorben

[Thorbeen]

Sure - what exactly do you need?

Thorben

[turbokongen]

Just a little heads up regarding the configuration:
If you use the customize frontend editor to change some other entity, the content of the floorplan.yaml is written into the customize.yaml file. (The !include floorplan.yaml line is replaced with the actual content from floorplan.yaml)
I spent 4 hours yesterday trying to figure out why any changes I did in floorplan.yaml never got applied.
So you’ve been warned

[radinsky]

The floorplan related files, just wondering how to align everything on the image as you did…

[Supersonical]

Hey, anyone here who can help me. Been at this for 1.5 hours and still not understanding where the issue is…

I´m getting thiss errror

2017-11-08 21:13:47 ERROR (Thread-2) [homeassistant.util.yaml] mapping values are not allowed here
in “/home/username/.homeassistant/floorplan.yaml”, line 4, column 11

>  name: Floorplan
>  image: /home/username/.homeassistant/www/custom_ui/floorplan/floorplan.svg
>  stylesheet: /home/username/.homeassistant/www/custom_ui/floorplan/floorplan.css
>     - name: Lights
>       entities:
>         - light.hallway
>         - light.kitchen
>         - light.bedroom
>         - switch.fhlampa
>         - switch.fvlampa
>       states:
>         - state: 'on'
>           class: 'light-on'
>         - state: 'off'
>           class: 'light-off'
>       action:
>         domain: homeassistant
>         service: toggle

[shire210]

Try adding:

groups:

below stylesheet and above - name at the same indentation level as “stylesheet”