Home Assistant Picture-Elements 3D Floorplan every step * 2021

Подписаться 885

Просмотров 54 тыс.

50% 1

In this video I’ll show you how to create a 3D floorplan Picture Elements in Home Assistant. We’ll use the Sweet Home 3D to create the layout and the floorplan, GIMP to edit the pictures and create the layers and to finish elements card in home assistant to add some icons to the image and how to interact with different switches, lights, sensors.
www.sweethome3d.com/
www.gimp.org/

Наука

Опубликовано:

22 ноя 2021

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 59

@KINGLIFERISM Год назад

When he said... "I already had it... but anyway I doing it so you can see how it's done." I smiled. Instantly liked this guy.

@colsoyeti1 2 года назад

Hi Robert, thank you for the detailed walkthrough tutorial. I enjoyed your teaching style and well explained steps. I hope to see more future videos and wish you a good and safe festive celebration.

@MrMuzza72 6 месяцев назад

thanks Robert for the great video, I tasked my son (10 years old) to create our house in sweethome 3d and then he found and followed your video tutorial with ease. end result is awesome!

@tushardas9825 2 года назад

Incredible - This is so detailed and so informative - I have rarely experienced such honest tutorial videos in my life. Just salute to the Robert the Creator. Will look forward to all your videos. Do let us know if you are planning to teach Home Assistant for new learners like us, we are ready to join paid sessions of training.

@miguelavello7493 2 года назад

Robert, you were amazing explaining this video. This is the best video going step by step. Thank you for taking the time and sharing your knowledge. If you have time, could you share some of the resources that you used to get all this knowledge ? I think you gave us enough to get us moving forward, but there is more to learn for sure. THANK YOU !!!

@making-memories-nl 2 года назад

Thank you for this video and detailed explanation.

2 года назад

Thank you Robert, this is inspiring.

@tommysorensen7261 2 года назад

Very nice description. Thank you for sharing!

@gtype06260 Год назад

Thank you see much for this detailed explanation!

@carminecesta Год назад

Great Tutorial, really very clear, only thing when I put the action code I get an icon in the lower left corner that opens only the standard folder, would anyone have a solution? could someone post the full code if not prying where i should just change the Switch names? Thank you very much ( I use Home Assistant 2023.1.4)

@kleber0a0m 2 года назад

Muito bom o vídeo, consegui fazer com minha casa, gostei muito, obrigado =)

@hichamel926 2 года назад

thanks for sharing, great video

@yaronbarlevy8588 7 месяцев назад

Gteat video and well explained. Such an awesome addition to my smart home

@blizzardgaming8393 Год назад

Hi Robert, thank you so much for this Video. That makes it so easy to get my own Floorplan Dashboard. But I have 1 Problem. I cant switch the lights on or off in the Dashboard. I can just see the current state. I think it is the "type: state-icon". Is there another opportunity so solve this problem ? Thank you very much

@Hany_ElNaggar 11 месяцев назад

the best ever explain .. thank you

@user-oo7yu5oc6k 6 месяцев назад

0:13: ⚙ Tutorial on how to create an image element map for home automation using free software. 8:36: 🏡 Import and organize 3D models to create a 3D floor plan in Home Assistant. 15:42: ⚙ Creating a 3D floor plan with home office and bedroom using a home assistant. 23:57: 💡 Setting up and naming lights in different rooms for 3D floor plan visualization. 31:28: 🏡 Create and save different lighting scenes at home in a folder. 42:23: ⚙ Editing Floor Plan Elements with Opacity and Selection Tools. 52:50: 🖼 Create and organize 3D floor plan images for Home Assistant configuration. 58:55: ⚙ Configuring the image display for switches and icons on the screen. 1:05:16: ⚙ Customize icons and sensors in Home Assistant Picture elements.

@davidg3841 7 месяцев назад

Excellent tutorial! I have a question. When I select the images and isolate the light just like you are doing it in GIMP, I have multiple light sources in my living room, If I make the buttons like you do, I will have overlapping buttons. For example: 2 light sources in one room. If I make 2 separate images for each light source, what will happen in home assistant when I turn on both lights? The two images will overlap..

@DarrenChin60Days Год назад

very nice work, I appreciate your nice work and very informative for new user like me with 0% knowledge about coding ^_^

@alexandrubogdan2444 Год назад

Great job!

@hk9443 6 месяцев назад

the alpha channels are causing the overall lighting to dim in my case when more than one switch is on, is there any fix for this? i.e., 2 simple ceiling lights, I would expect 2 to be brighter than one with more coverage. I noticed the coverage got larger but both dims.

@rogeriocamargo1984 Год назад

Nice video! Thank you

@theattorney6072 Год назад

Hello, how about the TV, roller shutters, and A/C for exemple, how to animate it please on the 3D floorplan ?

@BdC9196 5 месяцев назад

That mouse must be destroyed 😂😂😂 good job mate. Thank you for your work

@KME2024 15 дней назад

😆😆😆😆😆😆

@Gaoding-je4wb 4 месяца назад

Do you have any idea why I can't turn on 2 lights at the same time? I creat the floor plan and everything ok except when I turn on a lamp the other one turn off

@stevecalise9299 2 года назад

Great video but that mouse clicking is very annoying.

@makoesim 2 года назад

Thank you so much

@MrValeridze Год назад

Nice job, Robert

@blizzardgaming8393 Год назад

Hi Robert. I found the solution by myselfe. You wrote the toggle directly after tap_action: You have to go one line don and write action: toggle then it works. See down below tap_action: action: toggle Best Regards

@salvamipc Год назад

Hi, thank you. but the acción: toggle was already in the code. if you look at the video at 1:11:24 you can see the code is there. There is a problem however, if one of the device is removed from the house, will make the image refresh constantly.

@theattorney6072 Год назад

Hello, i have an issue, when I click anywhere on the floorplan other than on lights icons and other elements, it still activates a menu for a light. Is it possible cancel this ? Only clicking actions allowed on icons ?? Thx

@Morit4466 6 месяцев назад

i have the same problem

@theattorney6072 6 месяцев назад

@@Morit4466 very annoying

@wysnney 2 месяца назад

"state_image: null" this msg null doesn't always appear when I save and I don't get results.

@-.Gaba-. Год назад

Nice tutorial

@magnushve764 8 месяцев назад

Your script goves me a picture within the picture and they do not have the same size. Icons can not be moved. What am I doing wrong?

@FearTheZap 2 года назад

Hi Robert. Is there a way to hide the circle that you get around the object that you klicked on? The faded circle is indicating the last thing you pressed with your mouse.

@salvamipc 2 года назад

Hi Robin, i dont get a circle, you can get a circle like constantly loading when one of the items in thw plan is misconfigure or missing.

@jay2d Год назад

Robert, outstanding tutorial. I've followed your tutorial, but I have a problem, if I click anywhere on all over the floor plan but the entity icons, I get a pop up of the last light entity on the yaml cascade, eg: my last light entity on the yaml cascade is my backyard kitchen light, so when I click, let's say, between 2 icons where no icon is showing, I get a pop up with the kitchen light "more info" window. Am I doing something wrong?

@jezperb Год назад

I have the same problem. Have you solved it?

@psb73 Год назад

Add "tap_action and hold action: none" to EACH type Example of my code: - type: image entity: light.dining_lamp tap_action: action: none hold_action: action: none style: top: 50% left: 50% width: 100% state_image: 'on': local/3D Floorplan/Light_Dining.png 'off': local/3D Floorplan/Plan_Transparent.png

@KC_Jimmy_Studio Год назад

@@psb73 thank you so much for this. Adding the hold_action line made all the difference!

@MrMuzza72 6 месяцев назад

@@psb73 thanks for that as adding that code fixed the issue for me

@liteglow2000 4 месяца назад

Any idea why IMAGE size will NOT match ?? whatever I try to do, they are NOT the same size !!

@alingabrielafloarei3499 10 месяцев назад

Great video Instead of GIMP can I use photoshop ?

@user-mfsc-2024 Год назад

where to specify the light bulb icon ? i didnt see any in ur code

@69ruiduck Год назад

hello Robert, I'm following your video that I think is the best but as I double the dark photo to transparent, I don't know how to do that...thanks

@salvamipc Год назад

You mean the outsite of the photo, or when you turn on the light the bit underneath? This is a series of small images. You have base image then the other comes on too as you need them

@69ruiduck Год назад

@@salvamipc at 36:47 to 37: 06, you duplicate the night photo, creating a transparent one from home_dark, how did you do that? I can't make the transparent one, did you notice? I'm following your video which I think is very detailed but you say you need two photos of the night one of them is transparent how do you do it? thanks

@DAE51D 5 месяцев назад

is there audio on this? it's dead silent for me??

@renatobarbosa02 4 месяца назад

First of all, thank you for this wonderful tutorial!! But I need more help. I didn't understand how to create this part of the code. - type: image entity: switch.entrance_switch_1l I don't understand where this entity, entrance_switch_1l, comes from. You don't say in the video when you create it. Sorry my English is very bad. Would you help me ?

@renatobarbosa02 4 месяца назад

Sorry, I found the solution and placed the lamp directly. But now I have another problem, my whole image is clickable for more information about the last entity I added... I can't click on any other one!

@danielcojocaru4785 8 месяцев назад

Salut Robert.Mi-a placut mult videoclipul si chiar m-a ajutat.Dar cum ai pus intrerupatoarele acelea ptr fiecare lampa(virtuale)pe imagine?Multumesc.

@salvamipc 8 месяцев назад

salut, nu trebuie sa pui interuptor pe lampa. faci tot din home assisnat. Din picture ellements card. In cazul meu cu masa si cele 3 lapi de exemplu, ai poza cu masa si lumina pornita si optita, si codu e de mai jos. Pentru fiecare lampa am creat un cod care incepe - type: state-icon si ca sa nu se vada interuptorul pui opacity: 0, asa e ascuns, sau adaugi '--paper-item-icon-color': white si schimbi white cu culoara la fundal asa nu se vede. Vezi cele 3 lincuri, pe primu e poza initiala, al doilea ecel ce controleaza, e cu poza cu masa si luminile aprinse, si a treia e un png transparent. drive.google.com/file/d/1TfXIO8qgZJSlzFTD5bsMDB2rSAdYnkTX drive.google.com/file/d/1hoxToH2aeoW52HAMLv0qQxp5T05CqeVa drive.google.com/file/d/1lx9w75EY2Bchmd698FEl5qMTW6BdrMgI - type: image entity: switch.dining_switch style: left: 50% top: 50% width: 100% state_image: 'on': local/images/3d_plan/dining_light.png 'off': local/images/3d_plan/transparent.png - type: state-icon entity: switch.dining_switch tap_action: action: toggle style: left: 23% top: 38% opacity: 0 '--mdc-icon-size': 60px - type: state-icon entity: switch.dining_switch tap_action: action: toggle style: left: 23% top: 45% opacity: 0 '--mdc-icon-size': 60px - type: state-icon entity: switch.dining_switch tap_action: action: toggle style: left: 23% top: 30% opacity: 0 '--mdc-icon-size': 60px

@danielcojocaru4785 8 месяцев назад

Mersi frumos ca mi-ai raspuns.O sa mai revin cu intrebari daca nu deranjez.Mai am unele nelamuriri.O seara buna.