Share your Floorplan

Thank you very much.

The fonts differ due to your phone not having that truetype font installed on it.
If you’d like them all the same, use a generic font all devices should have.

Thanks! I will try! :slight_smile:

This looks amazing! How did you get the room to light up? Are you using layers or something in the svg file?

Hello, first i want to give a big thanks to “pkozul” and all the people involved in the creation and evolution of this wonderfull feature. To “oakbrad” thank you for your beautyfull floorplan and awsome buttons. You have been my inspiration source for my own floorplan and again i would like to thank you for this.

I would like to know if it’s possible in your .svg file to “unhide/show” the invisible objects (filaments in the bulbs ‘glow’,…). For exemple when i had your ‘input_boolean.ui_livingroom’ to my floor plan it keeps the shadows from your floorplan objects. I wish i could change or replace it but i really don’t know how.

I’m sorry but i’m complete noob in .svg, .css and any help would be awsome.

Thanks.

Here’s my floor plan. I still need to add lights, power strips, etc.

If anyone is interested, I tweaked the ha-floorplan.html to support RGB lights.
The light should change its color and brightness based on the “rgb_color” and “brightness” attributes of the entity.
I only tested it with my Xiaomi Gateway but it works really nice.

Here is the code you need to add to ha-floorplan.html (just before the class_template code):

      if (entityConfig.group.rgb_template) {
        if (entityState.attributes.rgb_color) {
          rgb = entityState.attributes.rgb_color;
          fill = `#${rgb[0].toString(16)[0]}${rgb[1].toString(16)[0]}${rgb[2].toString(16)[0]}`;
          if (entityState.attributes.brightness) {
            fillOpacity = entityState.attributes.brightness / 255;
            if (fillOpacity < 0.5)
              fillOpacity = 0.5;
          }
          // Fill element based in rgb_color and brightness
          svgElement.style.fill = fill;
          svgElement.style.fillOpacity = fillOpacity;
        }
        else {
          // Off state - use class specified in floorplan.yaml
          targetClass = this.assemble(entityConfig.group.rgb_template, entityState, entities);
        }
      }

In the floorplan.yaml add these lines:

    - name: Gateways
      entities:
        - light.gateway_light_7811dcb23b46
      rgb_template: '
        return "off-state";
      '

The rgb_template returns the CSS class for the “off” state.
Now you should have an RGB light that changes its color dynamically.

:yum:

10 Likes

Thanks for sharing this really useful code! But I don`t seem to get it to work with my Hue lights.
Can you please share some text above and below your code in the ha-floorplan.html, so I can check if I have pasted it in the correct place, and have the correct spacing?

Edit: Just forget it, I just needed to delete the browser cache. So now it works! Thank you :smile:

That’s great.
I’d like to thank the creator of the floorplan add-on for writing this excellent code and all the other contributers in the forum. The result looks amazing and I’m adding more components every day.

1 Like

Can you post your files?

i can try - but i have currently moved away from floorplan - i’m working on custom tiles and custom UI. What specifically did you need?

I liked your home/away icons and your temperature as well.

Here’s mine!

3 Likes

Hi SMARTMEDIA / Smoculetz

Sorry for replying to such an old post.

I love the look of your pendants and have started setting these up on my floor plan. I have the light count working, but am unsure how I can set it up so if i press it all the lights that are on turn off?

Please can you help?

Does anyone know the best way to turn off all lights that are currently on without ones that are off going on?

dont use toggle but turn off to turn things off.
if you have lights or switches that use the same command for on and off, use an input boolean to turn the switch/light to turn on or of.

an input boolean that is off can never be turned on with a turn off command.

1 Like

Use a group. The group is “On” if one or more light is on. If you toggle the group it will turn off, turning off all the lights. If you toggle a group in “off” state it will turn on all the lights.

Thanks - I tried this but it turns the lights that are on off and the ones that are off on:

  - name: Lights_Group
    entities:     
      - group.all_lights
    action:
      domain: homeassistant
      service: toggle

Meh, sorry i was wrong :slightly_frowning_face:

1 Like

Hello infidels, … try this instead:

action:
  service: homeassistant.turn_off
  entity_id: group.all_lights

No luck, this doesnt seemt to do anything. If I hover it shows the state on / off but does nothinng when clicked:

  - name: Lights_Group
    entities:     
      - group.all_lights   
    action:
      service: homeassistant.turn_off
      entity_id: group.all_lights