Skip to content
  • Recent
  • Tags
  • 0 Unread 0
  • Categories
  • Unreplied
  • Popular
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
Logo
  1. ioBroker Community Home
  2. Deutsch
  3. Tester
  4. Test lovelace 5.x

NEWS

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    8.1k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    1.8k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    15
    1
    2.1k

Test lovelace 5.x

Scheduled Pinned Locked Moved Tester
968 Posts 91 Posters 418.6k Views 74 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • radicalreelR Offline
    radicalreelR Offline
    radicalreel
    wrote on last edited by
    #629

    Hallo zusammen,

    verstehe gerade etwas bzgl. theme nicht und komme nicht weiter. Hier der Theme:

    dark:
    
      # Colors
      text-color: '#DADADB'                                                           # Grey text
      text-medium-light-color: '#A0A2A8'                                              # Medium-light grey text
      text-medium-color: '#80828A'                                                    # Medium grey text
      text-dark-color: '#6A6B74'                                                      # Dark grey text
      accent-color: '#008bef'                                                         # Blue
      accent-medium-color: '#2484C9'                                                  # Decent blue
      background-color: '#3b4049'                                                     # Dark grey background
      background-color-2: '#484E59'                                                   # Light grey background
      background-card-color: '#434952'                                                # Grey background
      border-color: '#383C46'                                                         # Grey border
    
      # Header
      app-header-background-color: '#363941'                                          # Background color
    
      # Text
      primary-color: 'var(--text-color)'
      text-primary-color: 'var(--text-color)'
    
      # Left Menu
      paper-listbox-background-color: 'var(--background-color)'                       # Background
      sidebar-icon-color: 'var(--text-medium-color)'                                  # icons
      sidebar-selected-icon-color: 'var(--text-medium-light-color)'                   # Selected row icon and background (15%)
      sidebar-selected-text-color: 'var(--text-color)'                                # Selected row label
    
      # UI
      paper-card-header-color: 'var(--text-color)'                                    # Title in settings
      primary-background-color: 'var(--background-color)'                             # Background (also title background in left menu)
      mdc-theme-primary: 'var(--accent-medium-color)'                                 # Action Buttons (save, restart etc.)
      card-background-color: 'var(--background-card-color)'                           # Entity Registry Background
    
      # Card
      paper-card-background-color: 'var(--background-card-color)'                     # Background
      dark-primary-color: 'var(--text-color)'
      primary-text-color: 'var(--text-color)'
      paper-listbox-color: 'var(--text-color)'
      light-primary-color: 'var(--text-dark-color)'
      secondary-text-color: 'var(--text-medium-color)'
      disabled-text-color: 'var(--text-dark-color)'
      paper-dialog-button-color: 'var(--text-color)'
      secondary-background-color: 'var(--background-color-2)'                         # Background more info title
    
      # Icons
      paper-item-icon-color: 'var(--text-dark-color)'                                 # Off
      paper-item-icon-active-color: 'var(--accent-color)'                             # On
    
      # Switches
      switch-checked-button-color: 'var(--text-medium-light-color)'                   # Knob On
      switch-unchecked-button-color: 'var(--text-medium-light-color)'                 # Knob Off
      switch-checked-track-color: '#009FFF'                                           # Background On
      switch-unchecked-track-color: '#767682'                                         # Background Off
    
      # Slider
      paper-slider-active-color: 'var(--accent-color)'                                # Line On
      paper-slider-knob-color: 'var(--text-medium-light-color)'                       # Knob On
      paper-slider-container-color: 'var(--text-dark-color)'                          # Line Off
      paper-slider-knob-start-color: 'var(--text-medium-light-color)'                 # Knob Off
    
      # Badges
      label-badge-text-color: 'var(--text-color)'
      label-badge-background-color: 'rgba(54, 57, 65, 0.6)'
    
      # Shadows
      ha-card-box-shadow: 'inset 0px 0px 0px 1px var(--border-color)'
    
      # HACS
      hacs-badge-color: 'var(--accent-color)'                                         # New Badge
      hacs-status-installed: 'var(--text-color)'                                      # Installed Icon
      hacs-status-pending-restart: 'var(--text-dark-color)'                           # Restart Icon
      hacs-status-pending-update: 'var(--accent-color)' 
    

    So sieht es aus:
    682a1471-95d1-4b1b-aa42-f85dc96b002c-image.png

    Warum sind die aktiven Symbole gelb? Gelb ist erstens nirgendwo definiert wenn ich das richtig sehe und durch
    paper-item-icon-active-color: 'var(--accent-color)'
    und
    accent-color: '#008bef'
    sollten die doch blau sein oder?

    David G.D XBiTX 2 Replies Last reply
    0
    • radicalreelR radicalreel

      Hallo zusammen,

      verstehe gerade etwas bzgl. theme nicht und komme nicht weiter. Hier der Theme:

      dark:
      
        # Colors
        text-color: '#DADADB'                                                           # Grey text
        text-medium-light-color: '#A0A2A8'                                              # Medium-light grey text
        text-medium-color: '#80828A'                                                    # Medium grey text
        text-dark-color: '#6A6B74'                                                      # Dark grey text
        accent-color: '#008bef'                                                         # Blue
        accent-medium-color: '#2484C9'                                                  # Decent blue
        background-color: '#3b4049'                                                     # Dark grey background
        background-color-2: '#484E59'                                                   # Light grey background
        background-card-color: '#434952'                                                # Grey background
        border-color: '#383C46'                                                         # Grey border
      
        # Header
        app-header-background-color: '#363941'                                          # Background color
      
        # Text
        primary-color: 'var(--text-color)'
        text-primary-color: 'var(--text-color)'
      
        # Left Menu
        paper-listbox-background-color: 'var(--background-color)'                       # Background
        sidebar-icon-color: 'var(--text-medium-color)'                                  # icons
        sidebar-selected-icon-color: 'var(--text-medium-light-color)'                   # Selected row icon and background (15%)
        sidebar-selected-text-color: 'var(--text-color)'                                # Selected row label
      
        # UI
        paper-card-header-color: 'var(--text-color)'                                    # Title in settings
        primary-background-color: 'var(--background-color)'                             # Background (also title background in left menu)
        mdc-theme-primary: 'var(--accent-medium-color)'                                 # Action Buttons (save, restart etc.)
        card-background-color: 'var(--background-card-color)'                           # Entity Registry Background
      
        # Card
        paper-card-background-color: 'var(--background-card-color)'                     # Background
        dark-primary-color: 'var(--text-color)'
        primary-text-color: 'var(--text-color)'
        paper-listbox-color: 'var(--text-color)'
        light-primary-color: 'var(--text-dark-color)'
        secondary-text-color: 'var(--text-medium-color)'
        disabled-text-color: 'var(--text-dark-color)'
        paper-dialog-button-color: 'var(--text-color)'
        secondary-background-color: 'var(--background-color-2)'                         # Background more info title
      
        # Icons
        paper-item-icon-color: 'var(--text-dark-color)'                                 # Off
        paper-item-icon-active-color: 'var(--accent-color)'                             # On
      
        # Switches
        switch-checked-button-color: 'var(--text-medium-light-color)'                   # Knob On
        switch-unchecked-button-color: 'var(--text-medium-light-color)'                 # Knob Off
        switch-checked-track-color: '#009FFF'                                           # Background On
        switch-unchecked-track-color: '#767682'                                         # Background Off
      
        # Slider
        paper-slider-active-color: 'var(--accent-color)'                                # Line On
        paper-slider-knob-color: 'var(--text-medium-light-color)'                       # Knob On
        paper-slider-container-color: 'var(--text-dark-color)'                          # Line Off
        paper-slider-knob-start-color: 'var(--text-medium-light-color)'                 # Knob Off
      
        # Badges
        label-badge-text-color: 'var(--text-color)'
        label-badge-background-color: 'rgba(54, 57, 65, 0.6)'
      
        # Shadows
        ha-card-box-shadow: 'inset 0px 0px 0px 1px var(--border-color)'
      
        # HACS
        hacs-badge-color: 'var(--accent-color)'                                         # New Badge
        hacs-status-installed: 'var(--text-color)'                                      # Installed Icon
        hacs-status-pending-restart: 'var(--text-dark-color)'                           # Restart Icon
        hacs-status-pending-update: 'var(--accent-color)' 
      

      So sieht es aus:
      682a1471-95d1-4b1b-aa42-f85dc96b002c-image.png

      Warum sind die aktiven Symbole gelb? Gelb ist erstens nirgendwo definiert wenn ich das richtig sehe und durch
      paper-item-icon-active-color: 'var(--accent-color)'
      und
      accent-color: '#008bef'
      sollten die doch blau sein oder?

      David G.D Online
      David G.D Online
      David G.
      wrote on last edited by
      #630

      @radicalreel

      Damit hab ich mich auch lange umgeschlagen.
      Ich glaube @XBiT hat mir weiter oben eine Lösung gepostet.

      Zeigt eure Lovelace-Visualisierung klick
      (Auch ideal um sich Anregungen zu holen)

      Meine Tabellen für eure Visualisierung klick

      radicalreelR 1 Reply Last reply
      0
      • radicalreelR radicalreel

        Hallo zusammen,

        verstehe gerade etwas bzgl. theme nicht und komme nicht weiter. Hier der Theme:

        dark:
        
          # Colors
          text-color: '#DADADB'                                                           # Grey text
          text-medium-light-color: '#A0A2A8'                                              # Medium-light grey text
          text-medium-color: '#80828A'                                                    # Medium grey text
          text-dark-color: '#6A6B74'                                                      # Dark grey text
          accent-color: '#008bef'                                                         # Blue
          accent-medium-color: '#2484C9'                                                  # Decent blue
          background-color: '#3b4049'                                                     # Dark grey background
          background-color-2: '#484E59'                                                   # Light grey background
          background-card-color: '#434952'                                                # Grey background
          border-color: '#383C46'                                                         # Grey border
        
          # Header
          app-header-background-color: '#363941'                                          # Background color
        
          # Text
          primary-color: 'var(--text-color)'
          text-primary-color: 'var(--text-color)'
        
          # Left Menu
          paper-listbox-background-color: 'var(--background-color)'                       # Background
          sidebar-icon-color: 'var(--text-medium-color)'                                  # icons
          sidebar-selected-icon-color: 'var(--text-medium-light-color)'                   # Selected row icon and background (15%)
          sidebar-selected-text-color: 'var(--text-color)'                                # Selected row label
        
          # UI
          paper-card-header-color: 'var(--text-color)'                                    # Title in settings
          primary-background-color: 'var(--background-color)'                             # Background (also title background in left menu)
          mdc-theme-primary: 'var(--accent-medium-color)'                                 # Action Buttons (save, restart etc.)
          card-background-color: 'var(--background-card-color)'                           # Entity Registry Background
        
          # Card
          paper-card-background-color: 'var(--background-card-color)'                     # Background
          dark-primary-color: 'var(--text-color)'
          primary-text-color: 'var(--text-color)'
          paper-listbox-color: 'var(--text-color)'
          light-primary-color: 'var(--text-dark-color)'
          secondary-text-color: 'var(--text-medium-color)'
          disabled-text-color: 'var(--text-dark-color)'
          paper-dialog-button-color: 'var(--text-color)'
          secondary-background-color: 'var(--background-color-2)'                         # Background more info title
        
          # Icons
          paper-item-icon-color: 'var(--text-dark-color)'                                 # Off
          paper-item-icon-active-color: 'var(--accent-color)'                             # On
        
          # Switches
          switch-checked-button-color: 'var(--text-medium-light-color)'                   # Knob On
          switch-unchecked-button-color: 'var(--text-medium-light-color)'                 # Knob Off
          switch-checked-track-color: '#009FFF'                                           # Background On
          switch-unchecked-track-color: '#767682'                                         # Background Off
        
          # Slider
          paper-slider-active-color: 'var(--accent-color)'                                # Line On
          paper-slider-knob-color: 'var(--text-medium-light-color)'                       # Knob On
          paper-slider-container-color: 'var(--text-dark-color)'                          # Line Off
          paper-slider-knob-start-color: 'var(--text-medium-light-color)'                 # Knob Off
        
          # Badges
          label-badge-text-color: 'var(--text-color)'
          label-badge-background-color: 'rgba(54, 57, 65, 0.6)'
        
          # Shadows
          ha-card-box-shadow: 'inset 0px 0px 0px 1px var(--border-color)'
        
          # HACS
          hacs-badge-color: 'var(--accent-color)'                                         # New Badge
          hacs-status-installed: 'var(--text-color)'                                      # Installed Icon
          hacs-status-pending-restart: 'var(--text-dark-color)'                           # Restart Icon
          hacs-status-pending-update: 'var(--accent-color)' 
        

        So sieht es aus:
        682a1471-95d1-4b1b-aa42-f85dc96b002c-image.png

        Warum sind die aktiven Symbole gelb? Gelb ist erstens nirgendwo definiert wenn ich das richtig sehe und durch
        paper-item-icon-active-color: 'var(--accent-color)'
        und
        accent-color: '#008bef'
        sollten die doch blau sein oder?

        XBiTX Offline
        XBiTX Offline
        XBiT
        wrote on last edited by
        #631

        @radicalreel

        Für die Lampe sollte "state-light-active-color" gehen oder auch "state-light-on-color".

        1 Reply Last reply
        0
        • David G.D David G.

          @radicalreel

          Damit hab ich mich auch lange umgeschlagen.
          Ich glaube @XBiT hat mir weiter oben eine Lösung gepostet.

          radicalreelR Offline
          radicalreelR Offline
          radicalreel
          wrote on last edited by
          #632

          @david-g @XBiT Danke euch. Bin der Einfachheit halber mal auf das noctis theme umgestiegen. Hatte einfach kein Bock lang rumzufriemeln.

          David G.D 1 Reply Last reply
          1
          • radicalreelR radicalreel

            @david-g @XBiT Danke euch. Bin der Einfachheit halber mal auf das noctis theme umgestiegen. Hatte einfach kein Bock lang rumzufriemeln.

            David G.D Online
            David G.D Online
            David G.
            wrote on last edited by
            #633

            @radicalreel

            Da hatte ich das auch....
            Gibt's da eine aktuelle Version?

            Zeigt eure Lovelace-Visualisierung klick
            (Auch ideal um sich Anregungen zu holen)

            Meine Tabellen für eure Visualisierung klick

            radicalreelR 1 Reply Last reply
            0
            • David G.D David G.

              @radicalreel

              Da hatte ich das auch....
              Gibt's da eine aktuelle Version?

              radicalreelR Offline
              radicalreelR Offline
              radicalreel
              wrote on last edited by radicalreel
              #634

              @david-g XBiT hatte eine korrigierte gepostet. die habe ich genommen. Sieht bislang gut aus.

              1 Reply Last reply
              0
              • H heinzie

                @tom8184
                Versuche mich aktuell auch gerade in lovelace einzuarbeiten. Man kann das bestimmt auch noch besser lösen, bei mir läuft es jetzt erst mal so:

                • die Variable shelly.0.,,,,,,.Shutter.state zusätzlich für lovelace ergänzt

                ebb9f172-cce8-4b1a-ad54-092c346f9db0-grafik.png

                • bei der Karte habe ich dann diesen Code für den Button Stop ergänzt
                move_stop_button:
                  tap_action:
                    action: call-service
                    service: number.set_value
                    target:
                      entity_id: cover.SHSW_25_B935A5_1_Shutter_state
                    data:
                      value: stop
                

                Damit läuft es bei mir und sieht dann so aus:

                dd9b612a-a197-4245-8f82-8e5888aa8c9d-grafik.png

                GarfonsoG Offline
                GarfonsoG Offline
                Garfonso
                Developer
                wrote on last edited by
                #635

                @heinzie said in Test lovelace 4.x:

                Damit läuft es bei mir

                Das überrascht mich... welchen Wert schreibt der service call denn da in den State? Und wird der immer als "stop" interpretiert oder nur weil bei deinen Tests der Rolladen gerade richtig stand?

                Für cover oder auch komplizierte light entities oder thermostate sollte der erste Ansatz immer sein, das Gerät sauber im "Geräte"-Tab von ioBroker zu haben. Zur Not als Alias. Dann klappts auch mit Lovelace.

                @xbit said in Test lovelace 4.x:

                könnte daran liegen das der "Stop" Taster bei Shelly "Pause" heißt

                Wie der "heißt" ist egal. Aber die Rolle ist wichtig. Da wäre bei shelly gut, wenn das auch button.stop wäre. Sonst weiß Lovelace nicht auf welchen der Knöpfe es für "stop" drücken muss. -> gerne dafür bei shelly ein issue erzeugen mit Hinweis auf den type-detector.

                @heinzie said in Test lovelace 4.x:

                Ich möchte über ein ganz einfache Karte bei meinen Dect301 Heizkörper Thermostaten die Solltemperatur entweder auf 17° oder 21° einstellen.

                Also auf den festen Wert?
                Das sollte mit einem "service_call" als Action möglich sein. Unterstützt mittlerweile auch der UI Editor. Also z.B. die Button Card (oder als Reihe in Elemente einfügen) und da als Aktion nicht "Umschalten", sondern "Dienst aufrufen" und da dann climate.set_temperature eintragen... warum der nicht in der Liste auftaucht, muss ich mir noch angucken.. urgs... naja, dann doch von hand:

                type: button
                tap_action:
                  action: call-service
                  service: climate.set_temperature
                  service_data:
                    temperature: 15
                    entity_id: climate.Buero
                entity: climate.Buero
                

                Ultimativer Lovelace Leitfaden: https://forum.iobroker.net/topic/35937/der-ultimative-iobroker-lovelace-leitfaden-dokumentation

                Lovelace UI Beispiele: https://forum.iobroker.net/topic/35950/zeigt-her-eure-lovelace-visualisierung

                H 1 Reply Last reply
                0
                • GarfonsoG Garfonso

                  @heinzie said in Test lovelace 4.x:

                  Damit läuft es bei mir

                  Das überrascht mich... welchen Wert schreibt der service call denn da in den State? Und wird der immer als "stop" interpretiert oder nur weil bei deinen Tests der Rolladen gerade richtig stand?

                  Für cover oder auch komplizierte light entities oder thermostate sollte der erste Ansatz immer sein, das Gerät sauber im "Geräte"-Tab von ioBroker zu haben. Zur Not als Alias. Dann klappts auch mit Lovelace.

                  @xbit said in Test lovelace 4.x:

                  könnte daran liegen das der "Stop" Taster bei Shelly "Pause" heißt

                  Wie der "heißt" ist egal. Aber die Rolle ist wichtig. Da wäre bei shelly gut, wenn das auch button.stop wäre. Sonst weiß Lovelace nicht auf welchen der Knöpfe es für "stop" drücken muss. -> gerne dafür bei shelly ein issue erzeugen mit Hinweis auf den type-detector.

                  @heinzie said in Test lovelace 4.x:

                  Ich möchte über ein ganz einfache Karte bei meinen Dect301 Heizkörper Thermostaten die Solltemperatur entweder auf 17° oder 21° einstellen.

                  Also auf den festen Wert?
                  Das sollte mit einem "service_call" als Action möglich sein. Unterstützt mittlerweile auch der UI Editor. Also z.B. die Button Card (oder als Reihe in Elemente einfügen) und da als Aktion nicht "Umschalten", sondern "Dienst aufrufen" und da dann climate.set_temperature eintragen... warum der nicht in der Liste auftaucht, muss ich mir noch angucken.. urgs... naja, dann doch von hand:

                  type: button
                  tap_action:
                    action: call-service
                    service: climate.set_temperature
                    service_data:
                      temperature: 15
                      entity_id: climate.Buero
                  entity: climate.Buero
                  
                  H Offline
                  H Offline
                  heinzie
                  wrote on last edited by
                  #636

                  @garfonso sagte in Test lovelace 4.x:

                  @heinzie said in Test lovelace 4.x:

                  Damit läuft es bei mir

                  Das überrascht mich... welchen Wert schreibt der service call denn da in den State? Und wird der immer als "stop" interpretiert oder nur weil bei deinen Tests der Rolladen gerade richtig stand?

                  Für cover oder auch komplizierte light entities oder thermostate sollte der erste Ansatz immer sein, das Gerät sauber im "Geräte"-Tab von ioBroker zu haben. Zur Not als Alias. Dann klappts auch mit Lovelace.

                  Ja, der schreibt das direkt in die von mir definierte Variable "cover.SHSW_25_B935A5_1_Shutter_state"
                  Habe ich extra noch einmal geprüft.
                  87b79379-f94b-42a6-a5ba-698db67882c1-image.png

                  Mit dem Geräte Tab habe ich das leider nicht hinbekommen, mache da wahrscheinlich noch irgendwas falsch.

                  1 Reply Last reply
                  0
                  • H Offline
                    H Offline
                    heinzie
                    wrote on last edited by
                    #637

                    Hallo,
                    versuche aktuell ein Widget mit Hilfe der Webcard einzubinden, dass klappt aber leider noch nicht.

                    Es geht um dieses Widget bzw diesen Code:

                    <div id="ww_dd0cf15507b32" v='1.3' loc='id' a='{"t":"responsive","lang":"de","sl_lpl":1,"ids":[],"font":"Arial","sl_ics":"one_a","sl_sot":"celsius","cl_bkg":"image","cl_font":"#FFFFFF","cl_cloud":"#FFFFFF","cl_persp":"#81D4FA","cl_sun":"#FFC107","cl_moon":"#FFC107","cl_thund":"#FF5722"}'><a href="https://weatherwidget.org/" id="ww_dd0cf15507b32_u" target="_blank">Html weather widget</a></div><script async src="https://app2.weatherwidget.org/js/?id=ww_dd0cf15507b32"></script>
                    

                    Kann mir dazu jemand vielleicht einen Tipp geben?

                    XBiTX 1 Reply Last reply
                    0
                    • H heinzie

                      Hallo,
                      versuche aktuell ein Widget mit Hilfe der Webcard einzubinden, dass klappt aber leider noch nicht.

                      Es geht um dieses Widget bzw diesen Code:

                      <div id="ww_dd0cf15507b32" v='1.3' loc='id' a='{"t":"responsive","lang":"de","sl_lpl":1,"ids":[],"font":"Arial","sl_ics":"one_a","sl_sot":"celsius","cl_bkg":"image","cl_font":"#FFFFFF","cl_cloud":"#FFFFFF","cl_persp":"#81D4FA","cl_sun":"#FFC107","cl_moon":"#FFC107","cl_thund":"#FF5722"}'><a href="https://weatherwidget.org/" id="ww_dd0cf15507b32_u" target="_blank">Html weather widget</a></div><script async src="https://app2.weatherwidget.org/js/?id=ww_dd0cf15507b32"></script>
                      

                      Kann mir dazu jemand vielleicht einen Tipp geben?

                      XBiTX Offline
                      XBiTX Offline
                      XBiT
                      wrote on last edited by XBiT
                      #638

                      @heinzie

                      mach dir eine Textdatei auf den Desktop und schreib da deinen Code rein -> Speicher es als zb. "wetter.html".
                      Lade dieser wetter.html in dein Lovelace hoch (da wo sonst die Cards in den Einstellungen hochgeladen werden).

                      Starte den ioBroker 1x neu (Neustart von Lovelace und Web Instance reicht bei mir nicht bzw. dauert es sonst ein paar Stunden bis er die Datei findet oder Änderung in der Datei übernimmt... warum auch immer.)

                      Danach kannst du damit Arbeiten:

                      type: iframe
                      url: /cards/wetter.html
                      aspect_ratio: 55%
                      
                      H 1 Reply Last reply
                      1
                      • XBiTX XBiT

                        @heinzie

                        mach dir eine Textdatei auf den Desktop und schreib da deinen Code rein -> Speicher es als zb. "wetter.html".
                        Lade dieser wetter.html in dein Lovelace hoch (da wo sonst die Cards in den Einstellungen hochgeladen werden).

                        Starte den ioBroker 1x neu (Neustart von Lovelace und Web Instance reicht bei mir nicht bzw. dauert es sonst ein paar Stunden bis er die Datei findet oder Änderung in der Datei übernimmt... warum auch immer.)

                        Danach kannst du damit Arbeiten:

                        type: iframe
                        url: /cards/wetter.html
                        aspect_ratio: 55%
                        
                        H Offline
                        H Offline
                        heinzie
                        wrote on last edited by
                        #639

                        @xbit Vielen Dank, hat sofort nach deiner Anleitung funktioniert.

                        Weißt du zufällig auch noch wie ich den weißen Hintergrund der Karte weg bekommen?

                        50748eaa-ec01-481c-b331-32cfc7d4d86d-image.png

                        David G.D XBiTX 2 Replies Last reply
                        0
                        • H heinzie

                          @xbit Vielen Dank, hat sofort nach deiner Anleitung funktioniert.

                          Weißt du zufällig auch noch wie ich den weißen Hintergrund der Karte weg bekommen?

                          50748eaa-ec01-481c-b331-32cfc7d4d86d-image.png

                          David G.D Online
                          David G.D Online
                          David G.
                          wrote on last edited by David G.
                          #640

                          @heinzie

                          Irgendwie (viel weiter oben) habe ich mal meine Wetterkarte gepostet.
                          Sieht ähnlich aus. Hatte den Vorteil, dass du es leicht an dein Theme anpassen kannst.

                          Screen_Recordin-1712245556535.gif

                          Edit
                          Sehe grad, bei deinem Widget kann man wohl auch Sachen anpassen.

                          Zeigt eure Lovelace-Visualisierung klick
                          (Auch ideal um sich Anregungen zu holen)

                          Meine Tabellen für eure Visualisierung klick

                          1 Reply Last reply
                          0
                          • H heinzie

                            @xbit Vielen Dank, hat sofort nach deiner Anleitung funktioniert.

                            Weißt du zufällig auch noch wie ich den weißen Hintergrund der Karte weg bekommen?

                            50748eaa-ec01-481c-b331-32cfc7d4d86d-image.png

                            XBiTX Offline
                            XBiTX Offline
                            XBiT
                            wrote on last edited by XBiT
                            #641

                            @heinzie

                            Der Hintergrund ist so ein Problem... der kommt von den Einstellungen wo du den "Code" erstellst sicherlich steht er auf "transparent" was im Iframe leider immer weiß wird und nicht durchsichtig.

                            Falls du einen einfarbigen Hintergrund in Lovelace hast musst du bei weatherwidget.org dein Widget die gleiche Farbe geben und den "Code" in der wetter.html Datei austauschen.

                            Oder du schaust dir mal die Wetter Card von @David-G an die ist besser integrierbar und nicht mit so einen Link zum Anbieter beim klick auf die Wetter-Karte.

                            1 Reply Last reply
                            0
                            • H Offline
                              H Offline
                              heinzie
                              wrote on last edited by
                              #642

                              Bin immer noch an meiner Wetterkarte am basteln.

                              Versuche es gerade mit dieser Platinum-Weather-Card die mir sehr gut gefällt.

                              Das Problem ist leider, dass keine Icon angezeigt werden. Habe das mit den Adapter DasWetter und openweathermap probiert.

                              Bei DasWetter vermute ich das der Pfad irgendwie nicht passt.

                              angegeben in der card wird:
                              /adapter/daswetter/icons/tiempo-weather/galeria1/6.png

                              die Icon liegen bei mir aber in:
                              /opt/iobroker/node_modules/iobroker.daswetter/icon/tiempo-weather/galeria2

                              muss ich die ggf. nur woanders hinkopieren?

                              07098681-0caa-4e40-bdd8-7a3252a3abf0-grafik.png

                              Bei openweathermap versucht er die wohl aus dem Netz zu laden, was leider auch nicht klappt:

                              6fe0f93b-a1fa-4dd9-bcfa-ead2ca230ac1-grafik.png

                              GarfonsoG 1 Reply Last reply
                              0
                              • U Offline
                                U Offline
                                umichel
                                wrote on last edited by
                                #643

                                Hi, ich nutze Lovelace als Visualisierung.
                                Ich plane ein BKW und mich würde interessieren, wie die Erfahrungen zur Visualisierungen damit sind?
                                Da ich noch nichts gekauft habe:
                                Die Wechselrichter können ja auch Daten liefern:

                                • Deye: Läuft eigentlich über eine Cloud, aber es gibt wohl auch einen iob Adapter der Daten liefert.
                                • Hoymiles: Hier geht es wohl über die openDTU Anbindung bzw. den openDTU Adapter.

                                Alternativ geht es wohl auch über einen Zwischenstecker (Shelly) um erzeugte Energie zu messen.

                                Was wären den die Vor- oder Nachteile der jeweiligen Lösungen?

                                astuermerA 1 Reply Last reply
                                0
                                • U umichel

                                  Hi, ich nutze Lovelace als Visualisierung.
                                  Ich plane ein BKW und mich würde interessieren, wie die Erfahrungen zur Visualisierungen damit sind?
                                  Da ich noch nichts gekauft habe:
                                  Die Wechselrichter können ja auch Daten liefern:

                                  • Deye: Läuft eigentlich über eine Cloud, aber es gibt wohl auch einen iob Adapter der Daten liefert.
                                  • Hoymiles: Hier geht es wohl über die openDTU Anbindung bzw. den openDTU Adapter.

                                  Alternativ geht es wohl auch über einen Zwischenstecker (Shelly) um erzeugte Energie zu messen.

                                  Was wären den die Vor- oder Nachteile der jeweiligen Lösungen?

                                  astuermerA Offline
                                  astuermerA Offline
                                  astuermer
                                  wrote on last edited by
                                  #644

                                  @umichel ich hab einen HM800 und nutze schlichtweg einen Shelly Plug zum Auslesen der Einspeisung.

                                  1 Reply Last reply
                                  0
                                  • U Offline
                                    U Offline
                                    umichel
                                    wrote on last edited by
                                    #645

                                    Hmm , OK.
                                    Ich hab gerade überlegt, dass ein Shelly bei mir eher suboptimal ist, weil er für den Aussbereich eher nicht so gut geeignet ist.

                                    Dann wohl eher die Frage ob openDTU (weil Wlan von drinnen zum WR) oder der Deye Adpater für den ioBroker.
                                    Ich weiss jetzt nicht was da besser wäre für die Anbindung an Lovelace.

                                    1 Reply Last reply
                                    -1
                                    • H heinzie

                                      Bin immer noch an meiner Wetterkarte am basteln.

                                      Versuche es gerade mit dieser Platinum-Weather-Card die mir sehr gut gefällt.

                                      Das Problem ist leider, dass keine Icon angezeigt werden. Habe das mit den Adapter DasWetter und openweathermap probiert.

                                      Bei DasWetter vermute ich das der Pfad irgendwie nicht passt.

                                      angegeben in der card wird:
                                      /adapter/daswetter/icons/tiempo-weather/galeria1/6.png

                                      die Icon liegen bei mir aber in:
                                      /opt/iobroker/node_modules/iobroker.daswetter/icon/tiempo-weather/galeria2

                                      muss ich die ggf. nur woanders hinkopieren?

                                      07098681-0caa-4e40-bdd8-7a3252a3abf0-grafik.png

                                      Bei openweathermap versucht er die wohl aus dem Netz zu laden, was leider auch nicht klappt:

                                      6fe0f93b-a1fa-4dd9-bcfa-ead2ca230ac1-grafik.png

                                      GarfonsoG Offline
                                      GarfonsoG Offline
                                      Garfonso
                                      Developer
                                      wrote on last edited by
                                      #646

                                      @heinzie said in Test lovelace 4.x:

                                      /adapter/daswetter/icons/tiempo-weather/galeria1/6.png

                                      Die URL passt. Der Adapter kriegt den Request und biegt ihn zum passenden Adapter um und schickt das Icon zurück.

                                      Die Karte erwartet an der Stelle keine URL, sondern eine Beschreibung des Wetters aus der sie dann ein Icon generieren will. Das ist der große Unterschied an der Stelle zwischen ioBroker und Homeassistant -> die ganzen Homeassistant Wetterkarten gehen für "uns" nicht. Die mitgelieferte hacke ich bei jedem Update entsprechend. Bei custom cards kann ich das nicht leisten...

                                      Ultimativer Lovelace Leitfaden: https://forum.iobroker.net/topic/35937/der-ultimative-iobroker-lovelace-leitfaden-dokumentation

                                      Lovelace UI Beispiele: https://forum.iobroker.net/topic/35950/zeigt-her-eure-lovelace-visualisierung

                                      H 1 Reply Last reply
                                      0
                                      • GarfonsoG Garfonso

                                        @heinzie said in Test lovelace 4.x:

                                        /adapter/daswetter/icons/tiempo-weather/galeria1/6.png

                                        Die URL passt. Der Adapter kriegt den Request und biegt ihn zum passenden Adapter um und schickt das Icon zurück.

                                        Die Karte erwartet an der Stelle keine URL, sondern eine Beschreibung des Wetters aus der sie dann ein Icon generieren will. Das ist der große Unterschied an der Stelle zwischen ioBroker und Homeassistant -> die ganzen Homeassistant Wetterkarten gehen für "uns" nicht. Die mitgelieferte hacke ich bei jedem Update entsprechend. Bei custom cards kann ich das nicht leisten...

                                        H Offline
                                        H Offline
                                        heinzie
                                        wrote on last edited by
                                        #647

                                        @garfonso sagte in Test lovelace 4.x:

                                        @heinzie said in Test lovelace 4.x:

                                        /adapter/daswetter/icons/tiempo-weather/galeria1/6.png

                                        Die URL passt. Der Adapter kriegt den Request und biegt ihn zum passenden Adapter um und schickt das Icon zurück.

                                        Die Karte erwartet an der Stelle keine URL, sondern eine Beschreibung des Wetters aus der sie dann ein Icon generieren will. Das ist der große Unterschied an der Stelle zwischen ioBroker und Homeassistant -> die ganzen Homeassistant Wetterkarten gehen für "uns" nicht. Die mitgelieferte hacke ich bei jedem Update entsprechend. Bei custom cards kann ich das nicht leisten...

                                        Danke für die Rückmeldung, dann kann man halt nichts machen.

                                        GarfonsoG 1 Reply Last reply
                                        0
                                        • H heinzie

                                          @garfonso sagte in Test lovelace 4.x:

                                          @heinzie said in Test lovelace 4.x:

                                          /adapter/daswetter/icons/tiempo-weather/galeria1/6.png

                                          Die URL passt. Der Adapter kriegt den Request und biegt ihn zum passenden Adapter um und schickt das Icon zurück.

                                          Die Karte erwartet an der Stelle keine URL, sondern eine Beschreibung des Wetters aus der sie dann ein Icon generieren will. Das ist der große Unterschied an der Stelle zwischen ioBroker und Homeassistant -> die ganzen Homeassistant Wetterkarten gehen für "uns" nicht. Die mitgelieferte hacke ich bei jedem Update entsprechend. Bei custom cards kann ich das nicht leisten...

                                          Danke für die Rückmeldung, dann kann man halt nichts machen.

                                          GarfonsoG Offline
                                          GarfonsoG Offline
                                          Garfonso
                                          Developer
                                          wrote on last edited by
                                          #648

                                          @heinzie
                                          Naja, schon. Die default Karte verwenden und zusätzliche Werte daneben anzeigen wäre meine Empfehlung. Es gibt auch eine more-info Karte, die das more-info von entities anzeigt. Da steht beim wetter entity auch nochmal mehr als auf der Karte, glaube ich. Kann man auch mal angucken.

                                          Oder halt eine Karte für ioBroker bauen. Für accuweather gibt es sowas, wobei das dann auch immer ein wenig braucht, bis die aktualisiert wird, bei einem frontend update (keine ahnung, ob das schon passiert ist seit letztdem update. ( https://github.com/algar42/IoB.lovelace.accuweather-card -> ok, Antwort ist "nein", letzte Version 3 Jahre alt)

                                          Ultimativer Lovelace Leitfaden: https://forum.iobroker.net/topic/35937/der-ultimative-iobroker-lovelace-leitfaden-dokumentation

                                          Lovelace UI Beispiele: https://forum.iobroker.net/topic/35950/zeigt-her-eure-lovelace-visualisierung

                                          1 Reply Last reply
                                          0
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          255

                                          Online

                                          32.4k

                                          Users

                                          81.4k

                                          Topics

                                          1.3m

                                          Posts
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Login

                                          • Don't have an account? Register

                                          • Login or register to search.
                                          • First post
                                            Last post
                                          0
                                          • Recent
                                          • Tags
                                          • Unread 0
                                          • Categories
                                          • Unreplied
                                          • Popular
                                          • GitHub
                                          • Docu
                                          • Hilfe