Floorplan for Home Assistant

Third party integrations Floorplan
1433

I’m trying to get sensors to display the date and time, as well as the darksky summary. As you can see they only display NaN. But if I hover or click i see the actual data.

image
image703×805 32.5 KB

     groups:
        - name: Sensors
      entities:
         - sensor.kitchen_temperature
         - sensor.date
         - sensor.time
         - sensor.patio_temperature
         - sensor.dark_sky_summary
         - sensor.dark_sky_daytime_high_temperature
         - sensor.dark_sky_temperature
      #text_template: '${entity.state ? entity.state : "unknown"}'
      # An example of rounding up a number, i.e. a temperature of 90.1 becomes 91
      text_template: '${entity.state ? Math.ceil(entity.state) : "undefined"}'  
      class_template: '
        var temp = parseFloat(entity.state.replace("°", ""));
        if (temp < 10)
          return "temp-low";
        else if (temp < 30)
          return "temp-medium";
        else
          return "temp-high";
        '
1434

Thanks so much for your work and the floorplan is now working great with my HA!

But as I know little about the HA, I have one question and ask for help.

I import a projector into the floorplan, and want to switch on in sequence the following items when I click or touch on the projector.

  • the box player;
  • the music decoder;
  • the amplifier, and
  • the benq projector.

What shall I do to get this done? Thanks in advance!

1435

Create an input_boolean in HA then associate it with your projector image in FP then create an automation to do your sequence when it’s toggled or switched.

1436

thanks and get it done!

1437

I am trying to add dynamic icons to my floorplan but am struggling. My issue is the icons appear UNDER the rectangle (both the rectangle and icon have mouse-over info but rectangle is invisible).

EDIT: Nevermind, figured it out! Had to remove rect from layer and add it to root in the SVG

1438

I’m currently using Floorplan for my new HA instance.

A tip to design quickly and have a great plan:

  • use Swet Home 3D to design your plan
  • export it as svg format
  • open it with inkscape
  • create at least two layers (plan, home assistant)
  • select all and move it to plan payer
  • then work on home automation layer

I have test this method and it’s really great since I can modify my plan on Sweet Home 3D and then re-use old home assistant layers on top of it.

Currently I re-use an accurate plan from Sweet Home 3D and I’m adding lights with degrade on inkscape.
I can click on lights zone and it’s working.
Need to understand how to modify CSS to make appear/disappear lights degrade now.

2 Likes
1439

Hi there

I’m new to floor plan and I really like it. Even spent time drawing out my floor plan in sweet home 3D so it looks even better :slight_smile:
Now, I have toggle configured in my floorplan.yaml and if I click on the object, it does switch on/off in the card. This is good.

However if I click anywhere else on the floorplan card, I get the pop up like the screenshot below.

floorplan
floorplan1920×1080 297 KB

Is there a way to suppress the pop up? So if my fat fingers miss the object I wanted to control, nothing happens.

Thank you

1440

I got the same problem too on the state card but not on custom panel.

Another problem: clicks on items do nothing at all on my phone (using chrome) while it’s working on my computer.

1441

Please … I’m trying for hours …

  • name: CurrentTemperatureNetatmoThermostat
    entities:
    - climate.termostato
    text_template: ‘${entity.attributes.current_temperature ? Math.ceil(entity.attributes.current_temperature): “undefined”}’

in the .svg plan I put a textbox with ID climate.termostato.attributes.current_temperature

it doesn’t work I’ ve a thermos Netatmo that is a climate type.

1442

it should be only “climate.termostato”.

1 Like
1443

Great!!! Thankyou!!!

1444

First off great work on Floorplan. I just started working on mine the other day and so far I love it. Once think I am trying to do is have multiple floorplans. What I am trying to accomplish is to have the user click in the kitchen (or any other room) and get a detailed view to pop up (another floorplan) and this would contain all lights and info for that room. Then there would be a mini-floor plan on the screen that the user could click and be taken back to the main floor plan.
I have two floor plans currently working, Downstairs and Kitchen.
I have (using binary_sensor) created the ability to click on the mini floor plan but it will only display a window of the floorplan and not switch the to the full screen…

PNG
PNG1247×856 77.6 KB

How can I make click on an element actually open the new floor plan?

1445

I were lucky 'cause I made EXACTLY the same mistake one day before you :wink:

1446

anyone else experiencing slow/delayed CSS animations after click?
I’ve been experiencing 2-3 seconds of delay whenever i click on my button and then my CSS animation kicks in after 2-3 seconds

1447

Hi guys, this is my floorplan so far.

I am experiencing a delay with the CSS animations tho, sometimes it takes a 2-3 second delay. is anybody else experiencing that?

I’ve even tried just a short page with one entity and 2 circles as test button clicks, but it still the same 2-3 seconds of delay to toggle my CSS display: none and display: block.

https://media.giphy.com/media/L0s0yDS8SKwWSahmr5/giphy.gif(image larger than 3072KB)

gekim-demo
gekim-demo1400×10865 1.99 MB

3 Likes
1448

Have always had that delay timeframe from floorplan, haven’t been able to change.

Running my HA on a intel nuc with plenty of power.

1449

Is it possible to add HA floorplan on Lovelace ui view ?
edit: I think it’s not :’(

1450

Yes, using a panel and a picture elements.
Something like this:

  - title: floorplan
    panel: true
    path: floorplan
    badges: []
    cards:
      - type: picture-elements
        image: /local/custom_ui/floorplan/floorplan.svg
        elements:
          - type: state-label
            entity: sensor.lr_temperature
            style:
              left: 72%
              top: 44%
          - type: state-label
            entity: sensor.r1_temperature
            style:
              left: 39%
              top: 58%

(edit: reorder code)

1 Like
1452

thanks ! But this way, elements defined in the svg seems to be unclikable…

1453

Also happens with me.

Workaround is to redefine the elements in the elements: of the picture-elements
Like this:

        elements:
          - type: state-label
            entity: sensor.lr_temperature
            style:
              left: 72%
              top: 44%

check the docs https://www.home-assistant.io/lovelace/picture-elements/

1 Like