Share your Floorplan

@iantrich In the next few days :slight_smile:

4 Likes

How exciting !!

Are there any alternatives to inkscape paid or free that work with HA and floorplan?

Thanks

You can create the main part of your floorplan in any package that can output to SVG. I started creating my floorplan in Sweet Home 3D… havent finished yet but I think the new release of this component might push me to get it done!

2 Likes

Really enjoying floorplan. Latest update.

counting the days… how many still to go as I would like to get all my 6 floorplans in 1… happy to test it if you need somebody :slight_smile:

hi folks,
So up and running, got my floorplan all displaying (WHAT AN AWESOME SYSTEM!)

Can someone share some good CSS examples (i’m not a dev, mostly hack my way around things). Mostly i’d like to know how to use a different icon for light on (rather than just change the colour)

reason is i’ve noticed that if the light bulb icon is ‘hollow’ the clickable area is harder to click. So ideally like a white bulb, that becomes a different yellow one with the ‘shine’ marks - in the same way i’d like to use different speaker icons based on volume range? or even colours of hue based on warmth.

Been trawling the forums, but kinda hit a wall finding these bits.
very much open links to resources or a little help

Thanks :slight_smile:

I use something similar to show if the commute to work is longer than usual. You need to create a new group in your floorplan.html similar to the below:

        - name: Commute
          entities:
            - binary_sensor.alternate_route
          image_template: '
            var imageName = "";

            switch (entity.state) {
              case "on":
                imageName = "Issue";
                break;
              case "off":
                imageName = "Good";
                break;
            }

            return "/local/custom_ui/floorplan/images/commute/" + imageName + ".svg";
            '

The “return” path at the bottom can be anywhere inside your “www” folder. Save two svg images there (one for light on and one for light off) The name of the image needs to match “imageName” from above. In your floorplan.svg, you need to create a rectangle placeholder with the same name as the entity from above. That should hopefully get you going in the right direction.

More information can be found here:

1 Like

ah like that a lot - the filename is based on the imagename

Nice, thank you!

interesting - not getting it working as well as the css option (i also cant seem to toggle)

Has anyone got some good temp or hue light UI components - going to start working on entities - so can bring up the nest settings or light settings

thanks

J

when you use the buttons, what do you assign them to?

lets say i have a button (that ties to harmony), so essentially a momentary switch - there seems to be a long way and a short way to link it.

Some use a input_boolean. then create a switch
when input boolean is ‘on’ trigger switch. then use an automation to trigger harmony.

Little confused though… couldnt i just use an input_boolean. When on action_on is to turn on harmony specific activity?

thanks

Time to share my floorplan + audio control of two Bluesound Players + wake up lights interface


Loving this solution and how Floor Plan gives me the possibility to expose the key components to my wife without all the clutter of the HA UI

7 Likes

Great setup! I haven’t yet started on the floorplan journey, but setups like yours are the ones that really pull me in closer to giving it a shot. Control panels are the likely reason that I’d use floorplan versus actual top-down floor plans, even though some of those are quite fantastic.

thats awesome! i was looking at doing the audio controls on a separate/hidden panel, one per floor - are you using only spotify or harmony for other things?

The first section is my NAD amplifier which is controlled through a Broadlink IR bridge.
The media players are bluesound and the Spotify icon just switches the source to spotify and the last played sportify playlist. Besides that is the Radio icon which selects TuneIn as a source and starts playing the last active radio stream (would be easy to add a number of preset stations and Spotify playlists)
Between the media players are three buttons that cover the multiroom setup to duplicate the sound form one room into another or end the multiroom streaming.
This can easily be exteded ad infinitym, but I focused on the core functionality for a higher WAR (Wife Approval Rating)

1 Like

ha- I wonder how many of us here embark on these crazy projects for higher WAR. For me it all started with a TV, xbox, cable and a 7.1 surround system with 4 remote controls.

Here is mine - makes me realize how much i lack any artist talent #lovedevart

todo:
weather
(get the remote buttons to actually call harmony)
spotify panel/hidden layer
camera hidden layers to show the actual camera when clicking the icon
my automatic OBD II dongle arrived today, so going to try that too

5 Likes

Here’s the start of mine. I’m creating this for a tablet interface. I’m using the Google Material Design as a guide. From here, I’m looking to build a navigation in the bottom bar, but will wait for Petar to fully release the next version as he promises navigation will be much easier to do in the next version.

I’ve been searching high and low for an easy to use, very flexible front end for HA and Floorplan is king!

26 Likes

@j4Media This is beautiful! Will you be sharing this on github?

mfw I’ve been putting off creating a blueprint for weeks and realize that my neighbor across the street is an architect who will work for beer!

Thanks @iantrich. Yes, I will be sharing on github when it is completed.

4 Likes