Floor plan - projekt Twojego domu

faq
#1

Polecam darmowy program do projektowania pomieszczeń Home By Me

Wszystko łatwo daje się wyklikać, np. to jest nasze biuro 2D:

image
image1220×528 258 KB

i 3D:

image
image1469×734 498 KB

Taki obraz moża przez komponent galeria łatwo umieścić na karcie w aplikacji.

W wersji 0.104 (za kilka tygodni) mamy zaplanowane dodanie do galerii możliwości umieszczania na obrazie 3D sterowalnych urządzeń, dzięki czemu będzie można zaprojektować kartę z elementami obrazu (“picture-elements”) i sterować oświetleniem, odtwarzaczami oraz innymi urządzeniami z poziomu takiego planu :slight_smile:

5 polubień
#2

W wersji 0.104.2b0 do galerii dodaliśmy piewszą wersję narzędzia ułatwiającego generowanie styli CSS dla kart (w celu ich rozmieszczenia na rzucie podłogi.
Można go już wyprubować, w tym celu trzeba:

  1. zaprojektować widok pomieszczeń
  2. przesłać go do galerii

pliki które są wysyłane do galerii optymalizujemy (zmniejszamy) żeby szybciej się wyświetlały na kartach. Ważne, żeby nazwę pliku z rzutem podłogi zacząć od słowa floorplan wtedy go zoptymalizujemy troszkę inaczej niż zdjęcia na karty

image
image834×598 106 KB

  1. dodać nowy widok

    image
    image1019×677 91.2 KB

  2. zmienić tło dla widoku
    w tym celu musimy przejść do ręcznego edytora konfiguracji
    i dodać ręcznie element background do naszego nowego widoku

    image
    image1058×832 114 KB

po zapisaniu powinniśmy mieć coś takiego

image
image1907×884 312 KB

  1. przejść do generatora styli (nowa opcja w galerii)

    image
    image832×315 107 KB

  2. wybieramy ikonkę odtwarzacza i staramy się umieścić ramkę odtwarzacza w wybranym miejscu

image
image1902×938 419 KB

8 . kopujemy wygenerowany kod karty

image
image791×498 130 KB

  1. wracamy do widoku z naszym rzutem pomieszczenia i dodajemy ręcznie kartę ze skopiowanego kodu

    image
    image1326×789 125 KB

  2. ręcznie dostosowujemy style css żeby osiągnąć ostateczny efekt

image
image1263×774 140 KB

  1. włączamy radio i :slight_smile:

image
image1185×491 99.1 KB

4 polubienia
Tekst na Floor Plan
0.104 nowa wersja na kanale beta
#3

@jolka doszedłem do punktu 6 i nie mam genreatora styli, wersja bramki 0.104.3b0
coś robię nie tak ?

#4

Ja u siebie mam ,może zła nazwa pliku. U siebie mam " floorplan_salon.jpg " i działa.
floorplan_salon1

2 polubienia
#5

To pewnie cache w przeglądarce, czasami po aktualizacji przeglądarka nadal korzysta przez jakiś czas ze starej wersji interfejsu. Zrób tak jak opisaliśmy tu:

To nie nazwa pliku, edytor jest dostępny dla każdego img (nazwa jest tylko po to żeby nie zniejszać tego pliku za mocno)

W przyszłości użyjemy tego edytora nie tylko do floorplan, ale też do kart typu elementy obrazu:

#6

hmmm rano nie było, a teraz jest
(rano robiłem na innym komputerze więc tak jak pisze @jolka to wina cache przeglądarki)
1
@mariusz_70 fajny projekt :+1: :clap:
jak zrobiłeś LED na około TV, nie mogę znaleźć
u mnie na razie tak:

4B341B79-FFB7-4CE0-AD83-FD5A2EB95606
4B341B79-FFB7-4CE0-AD83-FD5A2EB956061920×1080 169 KB

2 polubienia
#7

Nie to nie moja praca, projekt był zaadoptowany i przerobiony darmowym programem Sweet Home 3D
A ledy to wycieniowanie kolorystyczne które wykonane było programem Gimp

Lektura - https://www.wybudujmydom.pl/wystroj-wnetrz/3-bezplatne-programy-do-wizualizacji-wnetrz/

#8

ok, dzięki za informacje

#9

A tu instrukcja do Kazaplan:

#10

też utknąłem na tym punkcie co kolega

zrobiłem tak i też nic

gdzie szukać tego generatora ?

Przechwytywanie
Przechwytywanie717×680 25 KB

oraz nie widzę tego symbolu odtwarzacza z punktu 7
Przechwytywanie
Przechwytywanie1766×811 78.1 KB

chyba że nie o to chodzi bo jak patrzę na późniejsze kroki to wygląda to inaczej niż u mnie

#11

też mam podobnie jak Akszyn nie widzę edytora

#12

po ponad godzinie przesuwania góra/dół oraz prawo/lewo

image
image1470×786 190 KB

udało mi się osiągnąć coś takiego

  - icon: 'mdi:floor-plan'
    title: test
    path: floor
    background: center / cover no-repeat url("/local/img/floorplan.jpeg") fixed
    visible:
      - user: 95338e7b7e2149edb893acd164f12556
    panel: false
    badges: []
    cards:
      - name: radio
        type: button
        entity: input_boolean.radio
        tap_action:
          action: toggle
        show_name: false
        style: |
          ha-card 
          {
            position: absolute;
            width: 29.7%;
            background: transparent;
            transform: translate3d(271px, 29px, 0px);  
          }
      - name: komputer
        type: button
        entity: cover.pc
        tap_action:
          action: toggle
        show_name: false
        style: |
          ha-card 
          {
            position: absolute;
            width: 30%;
            background: transparent;
            transform: translate3d(222px, 54px, 0px);  
          }
      - name: światło
        type: button
        entity: light.the_light
        tap_action:
          action: toggle
        show_name: false
        style: |
          ha-card 
          {
            position: absolute;
            width: 35%;
            background: transparent;
            transform: translate3d(6px, 59px, 0px);  
          }
      - name: telewizor
        type: button
        entity: switch.telewizor_hyundai
        icon: 'mdi:television-classic'
        tap_action:
          action: toggle
        show_name: false
        style: |
          ha-card 
          {
            position: absolute;
            width: 22%;
            background: transparent;
            transform: translate3d(-370px, -15px, 0px);  
          }
#13

floorpl.
floorpl.1869×1225 172 KB

Witam, a jak zrobić żeby obraz zmniejszyć? Floorplan nie mieści się w oknie.

#14

Niestety nie można wybrać optymalnego ustawienia widoku. Jeżeli na komputerze wygląda ok, to na komórce brak części mieszkania. I na odwrót.

#15

Bo to się chyba robi widok pod konkretne urządzenie a to raczej się nie skaluje Więc chyba musisz zrobić osobny widok pod każde urządzenie osobno

1 polubienie
#17

Cześć, potrzebuję porady jak zrobić na floor planie zmieniający się kolor encji w zależności od stanu pobieranej bądź oddawanej energi, raz jest minus a raz sama wartość, chodzi o tą żółtą plamkę? Chcę aby gdy jest produkcja z PV to kolor tej encji zmieniał się na zielony . Nie wiem czy do końca składnia jest prawidłowa…

  • type: state-label
    entity: sensor.aktualny_pobor_energi_dom_w
    prefix: null
    style:
    top: 67%
    left: 83%
    border: false
    ‘–iron-icon-stroke-color’: ‘#0a0a0a’
    border-radius: 50%
    text-align: center
    color: ‘#000’
    font-weight: bold
    background-color: rgba(219, 194, 0, 2)

Przechwytywanie 2
Przechwytywanie 21351×683 102 KB

#18