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

  • Wartung am 15.11. – Forum ab 22:00 Uhr nicht erreichbar
    BluefoxB
    Bluefox
    11
    2
    199

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

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

Test lovelace 5.x

Test lovelace 5.x

Scheduled Pinned Locked Moved Tester
968 Posts 91 Posters 418.1k 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.
  • David G.D David G.

    @m1r0o sagte in Test lovelace 3.x:

    @david-g Direkt Lovelace über die Website-Karte

    Da gibt's leider keine Möglichkeit. Zumindest keine die ich wüsste außer den Umweg über vis.

    M Offline
    M Offline
    M1R0O
    wrote on last edited by M1R0O
    #186

    @david-g
    Mit vis habe ich mich nie beschäftigt, weiß leider gar nicht wo ich anfangen soll.

    In diesem Thread wurde genau mein Problem gelöst:

    In dem vom RING Adapter angelegten Datenpunkt ist die URL mit Angabe des Hostes abgelegt, dass war nicht so gut, ich habe den Hostnamen gegen die Host IP per Script getauscht.

    on({id: 'ring.0.doorbell_21502358.livestream_url', change: "ne"}, async function (obj) {
    var string = getState("ring.0.doorbell_21502358.livestream_url").val;
    var newstring
    newstring=string.replace("http://DESKTOP-RQ1PD76(SmartHome)","http://192.168.178.xxx");
    log(newstring);
    setState("ring.0.doorbell_21502358.livestream_url",newstring)
    });
    

    Aus "http://DESKTOP-RQ1PD76(SmartHome):8082/ring.0/doorbell_21502358/livestream21502358_1629730800258.mp4" ist nun
    http://192.168.178.xxx:8082/ring.0/doorbell_21502358/livestream21502358_1629730800258.mp4 geworden.

    Der Eintrag im HTML-Widget sieht jetzt so aus:

    <video height="448px" width="800" autoplay muted loop="true">
            <source src="{ring.0.doorbell_21502358.livestream_url}" type="video/mp4">
    </video>
    

    Das klappt.

    Ich habe mit ein Skript analog zum oberen geschrieben und den HTML-Eintrag in eine Markdown-Karte geschrieben. Die Karte bleibt aber weiß.

    Ich weiß also nicht, was ich für Lovelace wo eintragen muss. Wenn du mir da einen Tipp geben kannst, würde ich versuchen es zu realisieren.

    @XBiT: Das hat bei mir so nicht geklappt, danke.

    David G.D XBiTX 2 Replies Last reply
    0
    • M M1R0O

      @david-g
      Mit vis habe ich mich nie beschäftigt, weiß leider gar nicht wo ich anfangen soll.

      In diesem Thread wurde genau mein Problem gelöst:

      In dem vom RING Adapter angelegten Datenpunkt ist die URL mit Angabe des Hostes abgelegt, dass war nicht so gut, ich habe den Hostnamen gegen die Host IP per Script getauscht.

      on({id: 'ring.0.doorbell_21502358.livestream_url', change: "ne"}, async function (obj) {
      var string = getState("ring.0.doorbell_21502358.livestream_url").val;
      var newstring
      newstring=string.replace("http://DESKTOP-RQ1PD76(SmartHome)","http://192.168.178.xxx");
      log(newstring);
      setState("ring.0.doorbell_21502358.livestream_url",newstring)
      });
      

      Aus "http://DESKTOP-RQ1PD76(SmartHome):8082/ring.0/doorbell_21502358/livestream21502358_1629730800258.mp4" ist nun
      http://192.168.178.xxx:8082/ring.0/doorbell_21502358/livestream21502358_1629730800258.mp4 geworden.

      Der Eintrag im HTML-Widget sieht jetzt so aus:

      <video height="448px" width="800" autoplay muted loop="true">
              <source src="{ring.0.doorbell_21502358.livestream_url}" type="video/mp4">
      </video>
      

      Das klappt.

      Ich habe mit ein Skript analog zum oberen geschrieben und den HTML-Eintrag in eine Markdown-Karte geschrieben. Die Karte bleibt aber weiß.

      Ich weiß also nicht, was ich für Lovelace wo eintragen muss. Wenn du mir da einen Tipp geben kannst, würde ich versuchen es zu realisieren.

      @XBiT: Das hat bei mir so nicht geklappt, danke.

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

      @m1r0o

      Du kannst das so nicht in markdown setzen.
      Markdown ist was ganz "dummes" und kann nur was Text, Bilder und Tabellen anzeigen.

      Du musst dir in vis (da habe ich auch keine Ahnung von) mit diesem HTML widget eine view bauen. Vermutlich am besten ganzseitige?

      Diese kannst du dann als Website (nicht markdown) einbinden.

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

      Meine Tabellen für eure Visualisierung klick

      1 Reply Last reply
      0
      • M M1R0O

        @david-g
        Mit vis habe ich mich nie beschäftigt, weiß leider gar nicht wo ich anfangen soll.

        In diesem Thread wurde genau mein Problem gelöst:

        In dem vom RING Adapter angelegten Datenpunkt ist die URL mit Angabe des Hostes abgelegt, dass war nicht so gut, ich habe den Hostnamen gegen die Host IP per Script getauscht.

        on({id: 'ring.0.doorbell_21502358.livestream_url', change: "ne"}, async function (obj) {
        var string = getState("ring.0.doorbell_21502358.livestream_url").val;
        var newstring
        newstring=string.replace("http://DESKTOP-RQ1PD76(SmartHome)","http://192.168.178.xxx");
        log(newstring);
        setState("ring.0.doorbell_21502358.livestream_url",newstring)
        });
        

        Aus "http://DESKTOP-RQ1PD76(SmartHome):8082/ring.0/doorbell_21502358/livestream21502358_1629730800258.mp4" ist nun
        http://192.168.178.xxx:8082/ring.0/doorbell_21502358/livestream21502358_1629730800258.mp4 geworden.

        Der Eintrag im HTML-Widget sieht jetzt so aus:

        <video height="448px" width="800" autoplay muted loop="true">
                <source src="{ring.0.doorbell_21502358.livestream_url}" type="video/mp4">
        </video>
        

        Das klappt.

        Ich habe mit ein Skript analog zum oberen geschrieben und den HTML-Eintrag in eine Markdown-Karte geschrieben. Die Karte bleibt aber weiß.

        Ich weiß also nicht, was ich für Lovelace wo eintragen muss. Wenn du mir da einen Tipp geben kannst, würde ich versuchen es zu realisieren.

        @XBiT: Das hat bei mir so nicht geklappt, danke.

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

        @m1r0o

        eine Möglichkeit wäre es noch es so zu versuchen wie bei der Tagesschau in 100sec.

          - type: markdown
            content: >-
              # <center>News</center>
        
              <video src='{0_userdata.0.Links.Tagesschau.URL.Tagesschau100s}'
              width="100%" height="100%" poster="/cards/tagesschau_100sec.png"
              autobuffer controls>
        

        da der Wert von Datenpunkt

        https://media.tagesschau.de/video/2023/0410/TV-20230410-1007-5800.webxxl.h264.mp4
        

        ist also auch eine mp4 sollte es eventuell gehen.

        EDIT: kann sein das noch autoplay rein muss damit es gleich abgespielt wird.

        Beste Grüße
        XBiT

        David G.D 1 Reply Last reply
        1
        • XBiTX XBiT

          @m1r0o

          eine Möglichkeit wäre es noch es so zu versuchen wie bei der Tagesschau in 100sec.

            - type: markdown
              content: >-
                # <center>News</center>
          
                <video src='{0_userdata.0.Links.Tagesschau.URL.Tagesschau100s}'
                width="100%" height="100%" poster="/cards/tagesschau_100sec.png"
                autobuffer controls>
          

          da der Wert von Datenpunkt

          https://media.tagesschau.de/video/2023/0410/TV-20230410-1007-5800.webxxl.h264.mp4
          

          ist also auch eine mp4 sollte es eventuell gehen.

          EDIT: kann sein das noch autoplay rein muss damit es gleich abgespielt wird.

          Beste Grüße
          XBiT

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

          @xbit

          Das kannte ich noch gar nicht...
          Hast du zufällig das Script für mich, was die URL generiert?

          Mal gespannt, ob es bei einem stream funktioniert.

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

          Meine Tabellen für eure Visualisierung klick

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

            @xbit

            Das kannte ich noch gar nicht...
            Hast du zufällig das Script für mich, was die URL generiert?

            Mal gespannt, ob es bei einem stream funktioniert.

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

            @david-g

            /* VIS Tagesschau_Link
            parsed die Seite https://www.tagesschau.de/100sekunden/ und sucht nach der URL zum aktuellsten Video
            {1}
            02.03.2016 erstellt von pix
            15.03.2016 zu Javascript Instanz 1 gewechselt
            24.09.2016 umbenannt in VIS_Link_Tagesschau
            11.11.2018 Skript angepasst und optimiert
            03.05.2021 Skript angepasst
                   tagesschau 100s mp4
                   tagesschau Stream HTML-Link
            {1}
            todo: axios statt request() und etwas schöner machen
            {1}
            {1}
            */
            const fC = false; // forceCreation für createState()
            const logging = true;
            const dppfad = '0_userdata.0.Links.Tagesschau.'
            const idURL = dppfad + 'URL.Tagesschau';
            const idURL100s = dppfad + 'URL.Tagesschau100s';
             
            // ab hier nix mehr ändern
             
            createState(idURL,"", fC, {
             
               name: "HTML-Seite mit Tagesschau-Stream",
             
               desc: "geparster Link aus tagesschau.de",
             
               type: "string",
             
               role: "text.url"
             
            });
             
             
             
            createState(idURL100s,"", fC, {
             
               name: "Link zu Tagesschau in 100s",
             
               desc: "geparster Link aus tagesschau.de",
             
               type: "string",
             
               role: "text.url"
             
            });
             
             
             
            function findeURL () {   
             
               let request = require('request');
             
               let film_url;
             
               try {
             
                   // Tagesschau in 100s
             
                   const link = "http://www.tagesschau.de/100sekunden/";
             
                   let regexp = /https:\/\/media\.tagesschau\.de\/video\/\d*\/\d*\/TV-\d*-\d*-\d*\.webxxl\.h264\.mp4/gm;
             
                   request(link, function (error, response, body) {
             
                       if (!error && response.statusCode == 200) {
             
                           let result_arr = regexp.exec(body);
             
                           film_url = result_arr[0];
             
                           setState(idURL100s, film_url);
             
                           if (logging) log ("URL: " + film_url);
             
                       } else  { // Error beim Einlesen
             
                           log(error, 'error'); 
             
                       }
             
                   });   // Ende request 
             
               } catch (fehler) {
             
                   log("Fehler (try): " + fehler, "error");
             
               }
             
             
             
             
             
               
             
               // nicht schön, aber nochmal für Stream
             
               let stream_url;
             
               try {
             
                   //Tagesschau Stream als HTML
             
                   const link = "https://www.tagesschau.de/multimedia/livestreams/";
             
                   let regexp = /https:\/\/www\.tagesschau\.de\/multimedia\/livestreams\/livestream-\d*-\d*~player\.html/gm;
             
             
             
                   request(link, function (error, response, body) {
             
                       if (!error && response.statusCode == 200) {
             
                           let result_arr = regexp.exec(body);
             
                           stream_url = result_arr[0];
             
                           setState(idURL, stream_url);
             
                           if (logging) log ("HTML: " + stream_url);
             
                       } else  { // Error beim Einlesen
             
                           log(error, 'error'); 
             
                       }
             
                   });   // Ende request 
             
               } catch (fehler) {
             
                   log("Fehler (try): " + fehler, "error");
             
               }
             
            } // Ende findeURL
             
             
             
            schedule("8 */1 * * *", findeURL); // jedeStunde um 8 nach voll
             
            setTimeout(findeURL, 2000);
            

            Bitte

            M 1 Reply Last reply
            1
            • XBiTX XBiT

              @david-g

              /* VIS Tagesschau_Link
              parsed die Seite https://www.tagesschau.de/100sekunden/ und sucht nach der URL zum aktuellsten Video
              {1}
              02.03.2016 erstellt von pix
              15.03.2016 zu Javascript Instanz 1 gewechselt
              24.09.2016 umbenannt in VIS_Link_Tagesschau
              11.11.2018 Skript angepasst und optimiert
              03.05.2021 Skript angepasst
                     tagesschau 100s mp4
                     tagesschau Stream HTML-Link
              {1}
              todo: axios statt request() und etwas schöner machen
              {1}
              {1}
              */
              const fC = false; // forceCreation für createState()
              const logging = true;
              const dppfad = '0_userdata.0.Links.Tagesschau.'
              const idURL = dppfad + 'URL.Tagesschau';
              const idURL100s = dppfad + 'URL.Tagesschau100s';
               
              // ab hier nix mehr ändern
               
              createState(idURL,"", fC, {
               
                 name: "HTML-Seite mit Tagesschau-Stream",
               
                 desc: "geparster Link aus tagesschau.de",
               
                 type: "string",
               
                 role: "text.url"
               
              });
               
               
               
              createState(idURL100s,"", fC, {
               
                 name: "Link zu Tagesschau in 100s",
               
                 desc: "geparster Link aus tagesschau.de",
               
                 type: "string",
               
                 role: "text.url"
               
              });
               
               
               
              function findeURL () {   
               
                 let request = require('request');
               
                 let film_url;
               
                 try {
               
                     // Tagesschau in 100s
               
                     const link = "http://www.tagesschau.de/100sekunden/";
               
                     let regexp = /https:\/\/media\.tagesschau\.de\/video\/\d*\/\d*\/TV-\d*-\d*-\d*\.webxxl\.h264\.mp4/gm;
               
                     request(link, function (error, response, body) {
               
                         if (!error && response.statusCode == 200) {
               
                             let result_arr = regexp.exec(body);
               
                             film_url = result_arr[0];
               
                             setState(idURL100s, film_url);
               
                             if (logging) log ("URL: " + film_url);
               
                         } else  { // Error beim Einlesen
               
                             log(error, 'error'); 
               
                         }
               
                     });   // Ende request 
               
                 } catch (fehler) {
               
                     log("Fehler (try): " + fehler, "error");
               
                 }
               
               
               
               
               
                 
               
                 // nicht schön, aber nochmal für Stream
               
                 let stream_url;
               
                 try {
               
                     //Tagesschau Stream als HTML
               
                     const link = "https://www.tagesschau.de/multimedia/livestreams/";
               
                     let regexp = /https:\/\/www\.tagesschau\.de\/multimedia\/livestreams\/livestream-\d*-\d*~player\.html/gm;
               
               
               
                     request(link, function (error, response, body) {
               
                         if (!error && response.statusCode == 200) {
               
                             let result_arr = regexp.exec(body);
               
                             stream_url = result_arr[0];
               
                             setState(idURL, stream_url);
               
                             if (logging) log ("HTML: " + stream_url);
               
                         } else  { // Error beim Einlesen
               
                             log(error, 'error'); 
               
                         }
               
                     });   // Ende request 
               
                 } catch (fehler) {
               
                     log("Fehler (try): " + fehler, "error");
               
                 }
               
              } // Ende findeURL
               
               
               
              schedule("8 */1 * * *", findeURL); // jedeStunde um 8 nach voll
               
              setTimeout(findeURL, 2000);
              

              Bitte

              M Offline
              M Offline
              M1R0O
              wrote on last edited by
              #191

              @xbit
              Das sieht gut aus, ist aber zu hoch für mich 🙄

              David G.D XBiTX 2 Replies Last reply
              0
              • M M1R0O

                @xbit
                Das sieht gut aus, ist aber zu hoch für mich 🙄

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

                @m1r0o

                Für dich wäre vermutlich nur der kurze Part interessant.

                Zeug doch mal den Inhalt der Datenpunkte die mit dem Video zu tun haben. Evtl hilft das ja schon weiter.

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

                Meine Tabellen für eure Visualisierung klick

                M 1 Reply Last reply
                0
                • M M1R0O

                  @xbit
                  Das sieht gut aus, ist aber zu hoch für mich 🙄

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

                  @m1r0o

                  aus dem was ich von dir gelesen habe sollte so deine Card aussehen.

                  type: markdown
                  content: >-
                    # <center>Kamera</center>
                  
                    <video src='{ring.0.doorbell_21502358.livestream_url}' width="100%"
                    height="100%" autobuffer autoplay controls>
                  
                  1 Reply Last reply
                  1
                  • D Dave69

                    @david-g
                    Ja die Tage sind schon drin, aber die ändern sich ja erst morgen. Um zu sehen ob einstellungen wirksam sind ist die aktuelle Temp. gut geeigent, wenn auf der Wetter HP 5° steht sollte im DP auch 5° stehen. Wenn nicht, wie hier, weiter probieren. Aber OK ich gucke mal und mach notfalls nen eigenen Thread auf. Resonanz isz aber hier, von dir abgsehen, eher mau. liegts an der Wetter App oder an Lovelace weil es zu wenige Nutzer damit gibt??

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

                    @dave69 said in Test lovelace 3.x:

                    Resonanz isz aber hier, von dir abgsehen, eher mau. liegts an der Wetter App oder an Lovelace weil es zu wenige Nutzer damit gibt

                    Osterferien 🙂

                    @dave69 said in Test lovelace 3.x:

                    Bei der Temp Kurve wären die min,max Werte schön

                    Min/Max (und noch viel mehr 😉 ) kann die mini-graph-card.

                    @dave69 said in Test lovelace 3.x:

                    Blockly wäre aber auch Neuland für mich.

                    Du kannst auch das "Rules" Ding vom Javascript Adapter nehmen, das ist noch etwas einfachers "wenn -> dann" zusammen klicken (also in deinem Fall: Wenn neuer Wert für den State mit kWh, setzte Wert * x State für Euro). Aber in eines der Script-Verfahren solltest du dich etwas einarbeiten für ioBroker.

                    @dave69 said in Test lovelace 3.x:

                    Kann man eigentlich die Schriftgröße der Werte oder die größe der Karte selbst öndern?

                    Vielleicht über das theme? Ich würde aber empfehlen, wenn dir die Karte nicht zusagt, erstmal zu gucken, ob es schon fertige Alternativen gibt. Entweder bei denen, die dabei sind oder bei den custom-cards.

                    @dave69 said in Test lovelace 3.x:

                    Vorherssage kommt aktuell, steht heuet auf Donerstag, aktuelle Temp. ist aber falsch, das muss dann ja aber ein Problem vom Widget sein das er den falschen DP nimmt.

                    Ne, das liegt am "Das Wetter" Adapter. Der schreibt die aktuelle Temperatur irgendwohin, wo ihn keiner sonst findet... schulterzuck Von den WetterAdaptern funktioniert mittlerweile der accuweather am besten für lovelace / type-detector, würde ich sagen. Der liefert die meisten Daten und den hab ich mit dem Entwickler mal gerade gezogen. 😉 (und ich empfehle trotzdem die Standard Wetter Karte zu nehmen und nicht die, die der Entwickler geklöppelt hat, weil die nach Updates öfter mal nicht geht und blos nicht eine alte Anleitung mit modifiziertem type-detector nehmen... Raum & Funktion auf accuweather.0.Summary und fertig )

                    Grundsätzlich zu Raum & Funktion: Die dienen eigentlich dem User um Geräte / Datenpunkte zu sortieren. Der type-detector guckt sich allerdings manchmal auch die Funktion an und guckt ob die passen kann, wenn er sich unsicher ist. Solange die Datenpunkte sauber angelegt sind (z.B. sogar mit Devices-Adapter & Alias) sollte das auch keine Rolle spielen (sonst gerne issue erzeugen). Raum ist immer egal, wie er heißt, es muss nur einer konfiguriert sein.

                    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

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

                      @dave69 said in Test lovelace 3.x:

                      Resonanz isz aber hier, von dir abgsehen, eher mau. liegts an der Wetter App oder an Lovelace weil es zu wenige Nutzer damit gibt

                      Osterferien 🙂

                      @dave69 said in Test lovelace 3.x:

                      Bei der Temp Kurve wären die min,max Werte schön

                      Min/Max (und noch viel mehr 😉 ) kann die mini-graph-card.

                      @dave69 said in Test lovelace 3.x:

                      Blockly wäre aber auch Neuland für mich.

                      Du kannst auch das "Rules" Ding vom Javascript Adapter nehmen, das ist noch etwas einfachers "wenn -> dann" zusammen klicken (also in deinem Fall: Wenn neuer Wert für den State mit kWh, setzte Wert * x State für Euro). Aber in eines der Script-Verfahren solltest du dich etwas einarbeiten für ioBroker.

                      @dave69 said in Test lovelace 3.x:

                      Kann man eigentlich die Schriftgröße der Werte oder die größe der Karte selbst öndern?

                      Vielleicht über das theme? Ich würde aber empfehlen, wenn dir die Karte nicht zusagt, erstmal zu gucken, ob es schon fertige Alternativen gibt. Entweder bei denen, die dabei sind oder bei den custom-cards.

                      @dave69 said in Test lovelace 3.x:

                      Vorherssage kommt aktuell, steht heuet auf Donerstag, aktuelle Temp. ist aber falsch, das muss dann ja aber ein Problem vom Widget sein das er den falschen DP nimmt.

                      Ne, das liegt am "Das Wetter" Adapter. Der schreibt die aktuelle Temperatur irgendwohin, wo ihn keiner sonst findet... schulterzuck Von den WetterAdaptern funktioniert mittlerweile der accuweather am besten für lovelace / type-detector, würde ich sagen. Der liefert die meisten Daten und den hab ich mit dem Entwickler mal gerade gezogen. 😉 (und ich empfehle trotzdem die Standard Wetter Karte zu nehmen und nicht die, die der Entwickler geklöppelt hat, weil die nach Updates öfter mal nicht geht und blos nicht eine alte Anleitung mit modifiziertem type-detector nehmen... Raum & Funktion auf accuweather.0.Summary und fertig )

                      Grundsätzlich zu Raum & Funktion: Die dienen eigentlich dem User um Geräte / Datenpunkte zu sortieren. Der type-detector guckt sich allerdings manchmal auch die Funktion an und guckt ob die passen kann, wenn er sich unsicher ist. Solange die Datenpunkte sauber angelegt sind (z.B. sogar mit Devices-Adapter & Alias) sollte das auch keine Rolle spielen (sonst gerne issue erzeugen). Raum ist immer egal, wie er heißt, es muss nur einer konfiguriert sein.

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

                      @garfonso
                      @Dave69

                      Habe mir jetzt selber die Wetterkarte mit den animierten Icons nachgebaut.
                      Auf meinem Desktop sowie am Smartphone sieht alles ordentlich aus.

                      Die Farben werden aus dem Theme geholt, sollte also auch überall passen.

                      Animation.gif

                      Installation:

                      Den Ordner "wetter_animated" in den cards_Ordner von Lovelace kopieren.
                      Ich habe es über den Filemanager vom iobroker gemacht. Man kann man allerdings keinen Ordner hochladen.
                      Also erst den Ordner wetter_animated anlegen, dann kann man alle Bilder auf einmal hochladen.
                      Zusätzlich gibt es noch einen Ordner "nicht_animiert". Wenn man keine bewegten Icons haben möchte den Inhalt von diesem Ordner in wetter_animated hochladen.

                      icons.zip

                      Die Werte für die Karte werden nicht vom Typedetector erkannt.
                      Für Folgende Werte muss manuell in den Einstellungen des Datenpunktes Lovelace aktiviert werden:
                      (Alle im Ordner Summary vom AccuWheater-Adapter)

                      DayOfWeekd1-5
                      HoursOfSun
                      Pressure
                      RelativeHumidity
                      TempMax_d1-5
                      TempMin_d1-5
                      Temperature
                      WeatherIcon
                      WeatherIcon_d1-5
                      WindDirectionStr
                      Windspeed

                      Ich habe überall den automatisch ausgewählten Typ und Namen gelassen, so sollte es bei jedem funktionieren.

                      Wenn alles Erledigt ist noch folgende Karte in eurer Visualisierung einfügen:

                      type: picture-elements
                      elements:
                       - type: image
                         entity: input_text.Summary_WeatherIcon
                         tap_action:
                           action: none
                         image: /cards/wetter_animated/x.png
                         state_image:
                           '1': /cards/wetter_animated/day.svg
                           '2': /cards/wetter_animated/cloudy-day-1.svg
                           '3': /cards/wetter_animated/cloudy-day-2.svg
                           '4': /cards/wetter_animated/cloudy-day-3.svg
                           '5': /cards/wetter_animated/cloudy-day-3.svg
                           '6': /cards/wetter_animated/cloudy-day-3.svg
                           '7': /cards/wetter_animated/cloudy.svg
                           '8': /cards/wetter_animated/cloudy.svg
                           '11': /cards/wetter_animated/cloudy-day-1.svg
                           '12': /cards/wetter_animated/rainy-5.svg
                           '13': /cards/wetter_animated/rainy-2.svg
                           '14': /cards/wetter_animated/rainy-2.svg
                           '15': /cards/wetter_animated/thunder.svg
                           '16': /cards/wetter_animated/thunder.svg
                           '17': /cards/wetter_animated/thunder.svg
                           '18': /cards/wetter_animated/rainy-6.svg
                           '19': /cards/wetter_animated/snowy-4.svg
                           '20': /cards/wetter_animated/snowy-1.svg
                           '21': /cards/wetter_animated/snowy-1.svg
                           '22': /cards/wetter_animated/snowy-4.svg
                           '23': /cards/wetter_animated/snowy-1.svg
                           '24': /cards/wetter_animated/snowy-5.svg
                           '25': /cards/wetter_animated/snowy-5.svg
                           '26': /cards/wetter_animated/snowy-6.svg
                           '27': /cards/wetter_animated/snowy-6.svg
                           '28': /cards/wetter_animated/snowy-6.svg
                           '29': /cards/wetter_animated/snowy-6.svg
                           '30': /cards/wetter_animated/day.svg
                           '31': /cards/wetter_animated/snowy-6.svg
                           '32': /cards/wetter_animated/weather_sagittarius.svg
                           '33': /cards/wetter_animated/night.svg
                           '34': /cards/wetter_animated/cloudy-night-1.svg
                           '35': /cards/wetter_animated/cloudy-night-2.svg
                           '36': /cards/wetter_animated/cloudy-night-3.svg
                           '37': /cards/wetter_animated/cloudy-night-3.svg
                           '38': /cards/wetter_animated/cloudy-night-3.svg
                           '39': /cards/wetter_animated/rainy-5.svg
                           '40': /cards/wetter_animated/rainy-5.svg
                           '41': /cards/wetter_animated/thunder.svg
                           '42': /cards/wetter_animated/thunder.svg
                           '43': /cards/wetter_animated/snowy-6.svg
                           '44': /cards/wetter_animated/snowy-6.svg
                         style:
                           top: 12%
                           left: 18%
                           width: 25%
                       - type: state-label
                         entity: input_text.Summary_WeatherText
                         tap_action:
                           action: none
                         style:
                           top: 5%
                           left: 26%
                           font-size: 18px
                           color: var(--secondary-text-color)
                           transform: translate(0%, 0%)
                       - type: state-label
                         entity: input_text.Summary_Temperature
                         tap_action:
                           action: none
                         style:
                           top: 5%
                           left: 88%
                           font-size: 43px
                           color: var(--primary-text-color)
                           transform: translate(-100%, 0%)
                       - type: custom:text-element
                         text: °C
                         style:
                           top: 4%
                           left: 87%
                           font-size: 15px
                           color: var(--secondary-text-color)
                           transform: translate(0%,0%)
                       - type: icon
                         icon: mdi:weather-windy
                         style:
                           top: 32%
                           left: 15%
                           color: var(--paper-item-icon-color)
                           '--mdc-icon-size': 22px
                       - type: state-label
                         entity: input_text.Summary_WindDirectionStr
                         tap_action:
                           action: none
                         style:
                           top: 30%
                           left: 17%
                           font-size: 12px
                           color: var(--secondary-text-color)
                           transform: translate(0%, -50%)
                       - type: state-label
                         entity: input_number.Summary_WindSpeed
                         tap_action:
                           action: none
                         style:
                           top: 35%
                           left: 17%
                           font-size: 12px
                           color: var(--secondary-text-color)
                           transform: translate(0%, -50%)
                       - type: icon
                         icon: mdi:white-balance-sunny
                         style:
                           top: 41%
                           left: 41.5%
                           color: var(--paper-item-icon-color)
                           '--mdc-icon-size': 9%
                       - type: state-label
                         entity: sensor.Summary_HoursOfSun
                         suffix: ' h'
                         tap_action:
                           action: none
                         style:
                           top: 42%
                           left: 17%
                           font-size: 12px
                           color: var(--secondary-text-color)
                           transform: translate(0%, -50%)
                       - type: icon
                         icon: mdi:water-percent
                         style:
                           top: 33%
                           left: 76%
                           color: var(--paper-item-icon-color)
                           '--mdc-icon-size': 26%
                       - type: state-label
                         entity: input_number.Summary_RelativeHumidity
                         tap_action:
                           action: none
                         style:
                           top: 33%
                           left: 70%
                           font-size: 12px
                           color: var(--secondary-text-color)
                           transform: translate(0%, -50%)
                       - type: icon
                         icon: mdi:gauge
                         style:
                           top: 42%
                           left: 76.5%
                           color: var(--paper-item-icon-color)
                           '--mdc-icon-size': 21%
                       - type: state-label
                         entity: input_number.Summary_Pressure
                         tap_action:
                           action: none
                         style:
                           top: 42.5%
                           left: 70%
                           font-size: 13px
                           color: var(--secondary-text-color)
                           position: absolute
                           transform: translate(0%, -50%)
                       - type: custom:text-element
                         text: '|'
                         style:
                           top: 64%
                           left: 23%
                           font-size: 37px
                           color: var(--secondary-text-color)
                           transform: rotate(0.0turn) scale(0.5,2.8) translate(0%,0%)
                       - type: state-label
                         entity: input_text.Summary_DayOfWeek_d1
                         tap_action:
                           action: none
                         style:
                           top: 54%
                           left: 15%
                           font-size: 13px
                           color: var(--primary-text-color)
                       - type: image
                         entity: input_text.Summary_WeatherIcon_d1
                         tap_action:
                           action: none
                         image: /cards/wetter_animated/x.png
                         state_image:
                           '1': /cards/wetter_animated/day.svg
                           '2': /cards/wetter_animated/cloudy-day-1.svg
                           '3': /cards/wetter_animated/cloudy-day-2.svg
                           '4': /cards/wetter_animated/cloudy-day-3.svg
                           '5': /cards/wetter_animated/cloudy-day-3.svg
                           '6': /cards/wetter_animated/cloudy-day-3.svg
                           '7': /cards/wetter_animated/cloudy.svg
                           '8': /cards/wetter_animated/cloudy.svg
                           '11': /cards/wetter_animated/cloudy-day-1.svg
                           '12': /cards/wetter_animated/rainy-5.svg
                           '13': /cards/wetter_animated/rainy-2.svg
                           '14': /cards/wetter_animated/rainy-2.svg
                           '15': /cards/wetter_animated/thunder.svg
                           '16': /cards/wetter_animated/thunder.svg
                           '17': /cards/wetter_animated/thunder.svg
                           '18': /cards/wetter_animated/rainy-6.svg
                           '19': /cards/wetter_animated/snowy-4.svg
                           '20': /cards/wetter_animated/snowy-1.svg
                           '21': /cards/wetter_animated/snowy-1.svg
                           '22': /cards/wetter_animated/snowy-4.svg
                           '23': /cards/wetter_animated/snowy-1.svg
                           '24': /cards/wetter_animated/snowy-5.svg
                           '25': /cards/wetter_animated/snowy-5.svg
                           '26': /cards/wetter_animated/snowy-6.svg
                           '27': /cards/wetter_animated/snowy-6.svg
                           '28': /cards/wetter_animated/snowy-6.svg
                           '29': /cards/wetter_animated/snowy-6.svg
                           '30': /cards/wetter_animated/day.svg
                           '31': /cards/wetter_animated/snowy-6.svg
                           '32': /cards/wetter_animated/weather_sagittarius.svg
                           '33': /cards/wetter_animated/night.svg
                           '34': /cards/wetter_animated/cloudy-night-1.svg
                           '35': /cards/wetter_animated/cloudy-night-2.svg
                           '36': /cards/wetter_animated/cloudy-night-3.svg
                           '37': /cards/wetter_animated/cloudy-night-3.svg
                           '38': /cards/wetter_animated/cloudy-night-3.svg
                           '39': /cards/wetter_animated/rainy-5.svg
                           '40': /cards/wetter_animated/rainy-5.svg
                           '41': /cards/wetter_animated/thunder.svg
                           '42': /cards/wetter_animated/thunder.svg
                           '43': /cards/wetter_animated/snowy-6.svg
                           '44': /cards/wetter_animated/snowy-6.svg
                         style:
                           top: 65%
                           left: 15%
                           width: 17%
                       - type: state-label
                         entity: input_number.Summary_TempMax_d1
                         tap_action:
                           action: none
                         style:
                           top: 79%
                           left: 15%
                           font-size: 12px
                           color: var(--primary-text-color)
                       - type: state-label
                         entity: input_number.Summary_TempMin_d1
                         tap_action:
                           action: none
                         style:
                           top: 87%
                           left: 15%
                           font-size: 12px
                           color: var(--secondary-text-color)
                       - type: custom:text-element
                         text: '|'
                         style:
                           top: 64%
                           left: 40%
                           font-size: 37px
                           color: var(--secondary-text-color)
                           transform: rotate(0.0turn) scale(0.5,2.8)
                       - type: state-label
                         entity: input_text.Summary_DayOfWeek_d2
                         tap_action:
                           action: none
                         style:
                           top: 54%
                           left: 32.5%
                           font-size: 13px
                           color: var(--primary-text-color)
                       - type: image
                         entity: input_text.Summary_WeatherIcon_d2
                         tap_action:
                           action: none
                         image: /cards/wetter_animated/x.png
                         state_image:
                           '1': /cards/wetter_animated/day.svg
                           '2': /cards/wetter_animated/cloudy-day-1.svg
                           '3': /cards/wetter_animated/cloudy-day-2.svg
                           '4': /cards/wetter_animated/cloudy-day-3.svg
                           '5': /cards/wetter_animated/cloudy-day-3.svg
                           '6': /cards/wetter_animated/cloudy-day-3.svg
                           '7': /cards/wetter_animated/cloudy.svg
                           '8': /cards/wetter_animated/cloudy.svg
                           '11': /cards/wetter_animated/cloudy-day-1.svg
                           '12': /cards/wetter_animated/rainy-5.svg
                           '13': /cards/wetter_animated/rainy-2.svg
                           '14': /cards/wetter_animated/rainy-2.svg
                           '15': /cards/wetter_animated/thunder.svg
                           '16': /cards/wetter_animated/thunder.svg
                           '17': /cards/wetter_animated/thunder.svg
                           '18': /cards/wetter_animated/rainy-6.svg
                           '19': /cards/wetter_animated/snowy-4.svg
                           '20': /cards/wetter_animated/snowy-1.svg
                           '21': /cards/wetter_animated/snowy-1.svg
                           '22': /cards/wetter_animated/snowy-4.svg
                           '23': /cards/wetter_animated/snowy-1.svg
                           '24': /cards/wetter_animated/snowy-5.svg
                           '25': /cards/wetter_animated/snowy-5.svg
                           '26': /cards/wetter_animated/snowy-6.svg
                           '27': /cards/wetter_animated/snowy-6.svg
                           '28': /cards/wetter_animated/snowy-6.svg
                           '29': /cards/wetter_animated/snowy-6.svg
                           '30': /cards/wetter_animated/day.svg
                           '31': /cards/wetter_animated/snowy-6.svg
                           '32': /cards/wetter_animated/weather_sagittarius.svg
                           '33': /cards/wetter_animated/night.svg
                           '34': /cards/wetter_animated/cloudy-night-1.svg
                           '35': /cards/wetter_animated/cloudy-night-2.svg
                           '36': /cards/wetter_animated/cloudy-night-3.svg
                           '37': /cards/wetter_animated/cloudy-night-3.svg
                           '38': /cards/wetter_animated/cloudy-night-3.svg
                           '39': /cards/wetter_animated/rainy-5.svg
                           '40': /cards/wetter_animated/rainy-5.svg
                           '41': /cards/wetter_animated/thunder.svg
                           '42': /cards/wetter_animated/thunder.svg
                           '43': /cards/wetter_animated/snowy-6.svg
                           '44': /cards/wetter_animated/snowy-6.svg
                         style:
                           top: 65%
                           left: 32.5%
                           width: 17%
                       - type: state-label
                         entity: input_number.Summary_TempMax_d2
                         tap_action:
                           action: none
                         style:
                           top: 79%
                           left: 32.5%
                           font-size: 12px
                           color: var(--primary-text-color)
                       - type: state-label
                         entity: input_number.Summary_TempMin_d2
                         tap_action:
                           action: none
                         style:
                           top: 87%
                           left: 32.5%
                           font-size: 12px
                           color: var(--secondary-text-color)
                       - type: custom:text-element
                         text: '|'
                         style:
                           top: 64%
                           left: 57.5%
                           font-size: 37px
                           color: var(--secondary-text-color)
                           transform: rotate(0.0turn) scale(0.5,2.8)
                       - type: state-label
                         entity: input_text.Summary_DayOfWeek_d3
                         tap_action:
                           action: none
                         style:
                           top: 54%
                           left: 50%
                           font-size: 13px
                           color: var(--primary-text-color)
                       - type: image
                         entity: input_text.Summary_WeatherIcon_d3
                         tap_action:
                           action: none
                         image: /cards/wetter_animated/x.png
                         state_image:
                           '1': /cards/wetter_animated/day.svg
                           '2': /cards/wetter_animated/cloudy-day-1.svg
                           '3': /cards/wetter_animated/cloudy-day-2.svg
                           '4': /cards/wetter_animated/cloudy-day-3.svg
                           '5': /cards/wetter_animated/cloudy-day-3.svg
                           '6': /cards/wetter_animated/cloudy-day-3.svg
                           '7': /cards/wetter_animated/cloudy.svg
                           '8': /cards/wetter_animated/cloudy.svg
                           '11': /cards/wetter_animated/cloudy-day-1.svg
                           '12': /cards/wetter_animated/rainy-5.svg
                           '13': /cards/wetter_animated/rainy-2.svg
                           '14': /cards/wetter_animated/rainy-2.svg
                           '15': /cards/wetter_animated/thunder.svg
                           '16': /cards/wetter_animated/thunder.svg
                           '17': /cards/wetter_animated/thunder.svg
                           '18': /cards/wetter_animated/rainy-6.svg
                           '19': /cards/wetter_animated/snowy-4.svg
                           '20': /cards/wetter_animated/snowy-1.svg
                           '21': /cards/wetter_animated/snowy-1.svg
                           '22': /cards/wetter_animated/snowy-4.svg
                           '23': /cards/wetter_animated/snowy-1.svg
                           '24': /cards/wetter_animated/snowy-5.svg
                           '25': /cards/wetter_animated/snowy-5.svg
                           '26': /cards/wetter_animated/snowy-6.svg
                           '27': /cards/wetter_animated/snowy-6.svg
                           '28': /cards/wetter_animated/snowy-6.svg
                           '29': /cards/wetter_animated/snowy-6.svg
                           '30': /cards/wetter_animated/day.svg
                           '31': /cards/wetter_animated/snowy-6.svg
                           '32': /cards/wetter_animated/weather_sagittarius.svg
                           '33': /cards/wetter_animated/night.svg
                           '34': /cards/wetter_animated/cloudy-night-1.svg
                           '35': /cards/wetter_animated/cloudy-night-2.svg
                           '36': /cards/wetter_animated/cloudy-night-3.svg
                           '37': /cards/wetter_animated/cloudy-night-3.svg
                           '38': /cards/wetter_animated/cloudy-night-3.svg
                           '39': /cards/wetter_animated/rainy-5.svg
                           '40': /cards/wetter_animated/rainy-5.svg
                           '41': /cards/wetter_animated/thunder.svg
                           '42': /cards/wetter_animated/thunder.svg
                           '43': /cards/wetter_animated/snowy-6.svg
                           '44': /cards/wetter_animated/snowy-6.svg
                         style:
                           top: 65%
                           left: 50%
                           width: 17%
                       - type: state-label
                         entity: input_number.Summary_TempMax_d3
                         tap_action:
                           action: none
                         style:
                           top: 79%
                           left: 50%
                           font-size: 12px
                           color: var(--primary-text-color)
                       - type: state-label
                         entity: input_number.Summary_TempMin_d3
                         tap_action:
                           action: none
                         style:
                           top: 87%
                           left: 50%
                           font-size: 12px
                           color: var(--secondary-text-color)
                       - type: state-label
                         entity: input_text.Summary_DayOfWeek_d4
                         tap_action:
                           action: none
                         style:
                           top: 54%
                           left: 67.5%
                           font-size: 13px
                           color: var(--primary-text-color)
                       - type: image
                         entity: input_text.Summary_WeatherIcon_d4
                         tap_action:
                           action: none
                         image: /cards/wetter_animated/x.png
                         state_image:
                           '1': /cards/wetter_animated/day.svg
                           '2': /cards/wetter_animated/cloudy-day-1.svg
                           '3': /cards/wetter_animated/cloudy-day-2.svg
                           '4': /cards/wetter_animated/cloudy-day-3.svg
                           '5': /cards/wetter_animated/cloudy-day-3.svg
                           '6': /cards/wetter_animated/cloudy-day-3.svg
                           '7': /cards/wetter_animated/cloudy.svg
                           '8': /cards/wetter_animated/cloudy.svg
                           '11': /cards/wetter_animated/cloudy-day-1.svg
                           '12': /cards/wetter_animated/rainy-5.svg
                           '13': /cards/wetter_animated/rainy-2.svg
                           '14': /cards/wetter_animated/rainy-2.svg
                           '15': /cards/wetter_animated/thunder.svg
                           '16': /cards/wetter_animated/thunder.svg
                           '17': /cards/wetter_animated/thunder.svg
                           '18': /cards/wetter_animated/rainy-6.svg
                           '19': /cards/wetter_animated/snowy-4.svg
                           '20': /cards/wetter_animated/snowy-1.svg
                           '21': /cards/wetter_animated/snowy-1.svg
                           '22': /cards/wetter_animated/snowy-4.svg
                           '23': /cards/wetter_animated/snowy-1.svg
                           '24': /cards/wetter_animated/snowy-5.svg
                           '25': /cards/wetter_animated/snowy-5.svg
                           '26': /cards/wetter_animated/snowy-6.svg
                           '27': /cards/wetter_animated/snowy-6.svg
                           '28': /cards/wetter_animated/snowy-6.svg
                           '29': /cards/wetter_animated/snowy-6.svg
                           '30': /cards/wetter_animated/day.svg
                           '31': /cards/wetter_animated/snowy-6.svg
                           '32': /cards/wetter_animated/weather_sagittarius.svg
                           '33': /cards/wetter_animated/night.svg
                           '34': /cards/wetter_animated/cloudy-night-1.svg
                           '35': /cards/wetter_animated/cloudy-night-2.svg
                           '36': /cards/wetter_animated/cloudy-night-3.svg
                           '37': /cards/wetter_animated/cloudy-night-3.svg
                           '38': /cards/wetter_animated/cloudy-night-3.svg
                           '39': /cards/wetter_animated/rainy-5.svg
                           '40': /cards/wetter_animated/rainy-5.svg
                           '41': /cards/wetter_animated/thunder.svg
                           '42': /cards/wetter_animated/thunder.svg
                           '43': /cards/wetter_animated/snowy-6.svg
                           '44': /cards/wetter_animated/snowy-6.svg
                         style:
                           top: 65%
                           left: 67.5%
                           width: 17%
                       - type: state-label
                         entity: input_number.Summary_TempMax_d4
                         tap_action:
                           action: none
                         style:
                           top: 79%
                           left: 67.5%
                           font-size: 12px
                           color: var(--primary-text-color)
                       - type: state-label
                         entity: input_number.Summary_TempMin_d4
                         tap_action:
                           action: none
                         style:
                           top: 87%
                           left: 67.5%
                           font-size: 12px
                           color: var(--secondary-text-color)
                       - type: custom:text-element
                         text: '|'
                         style:
                           top: 64%
                           left: 75%
                           font-size: 37px
                           color: var(--secondary-text-color)
                           transform: rotate(0.0turn) scale(0.5,2.8)
                       - type: state-label
                         entity: input_text.Summary_DayOfWeek_d5
                         tap_action:
                           action: none
                         style:
                           top: 54%
                           left: 85%
                           font-size: 13px
                           color: var(--primary-text-color)
                       - type: image
                         entity: input_text.Summary_WeatherIcon_d5
                         tap_action:
                           action: none
                         image: /cards/wetter_animated/x.png
                         state_image:
                           '1': /cards/wetter_animated/day.svg
                           '2': /cards/wetter_animated/cloudy-day-1.svg
                           '3': /cards/wetter_animated/cloudy-day-2.svg
                           '4': /cards/wetter_animated/cloudy-day-3.svg
                           '5': /cards/wetter_animated/cloudy-day-3.svg
                           '6': /cards/wetter_animated/cloudy-day-3.svg
                           '7': /cards/wetter_animated/cloudy.svg
                           '8': /cards/wetter_animated/cloudy.svg
                           '11': /cards/wetter_animated/cloudy-day-1.svg
                           '12': /cards/wetter_animated/rainy-5.svg
                           '13': /cards/wetter_animated/rainy-2.svg
                           '14': /cards/wetter_animated/rainy-2.svg
                           '15': /cards/wetter_animated/thunder.svg
                           '16': /cards/wetter_animated/thunder.svg
                           '17': /cards/wetter_animated/thunder.svg
                           '18': /cards/wetter_animated/rainy-6.svg
                           '19': /cards/wetter_animated/snowy-4.svg
                           '20': /cards/wetter_animated/snowy-1.svg
                           '21': /cards/wetter_animated/snowy-1.svg
                           '22': /cards/wetter_animated/snowy-4.svg
                           '23': /cards/wetter_animated/snowy-1.svg
                           '24': /cards/wetter_animated/snowy-5.svg
                           '25': /cards/wetter_animated/snowy-5.svg
                           '26': /cards/wetter_animated/snowy-6.svg
                           '27': /cards/wetter_animated/snowy-6.svg
                           '28': /cards/wetter_animated/snowy-6.svg
                           '29': /cards/wetter_animated/snowy-6.svg
                           '30': /cards/wetter_animated/day.svg
                           '31': /cards/wetter_animated/snowy-6.svg
                           '32': /cards/wetter_animated/weather_sagittarius.svg
                           '33': /cards/wetter_animated/night.svg
                           '34': /cards/wetter_animated/cloudy-night-1.svg
                           '35': /cards/wetter_animated/cloudy-night-2.svg
                           '36': /cards/wetter_animated/cloudy-night-3.svg
                           '37': /cards/wetter_animated/cloudy-night-3.svg
                           '38': /cards/wetter_animated/cloudy-night-3.svg
                           '39': /cards/wetter_animated/rainy-5.svg
                           '40': /cards/wetter_animated/rainy-5.svg
                           '41': /cards/wetter_animated/thunder.svg
                           '42': /cards/wetter_animated/thunder.svg
                           '43': /cards/wetter_animated/snowy-6.svg
                           '44': /cards/wetter_animated/snowy-6.svg
                         style:
                           top: 65%
                           left: 85%
                           width: 17%
                       - type: state-label
                         entity: input_number.Summary_TempMax_d5
                         tap_action:
                           action: none
                         style:
                           top: 79%
                           left: 85%
                           font-size: 12px
                           color: var(--primary-text-color)
                       - type: state-label
                         entity: input_number.Summary_TempMin_d5
                         tap_action:
                           action: none
                         style:
                           top: 87%
                           left: 85%
                           font-size: 12px
                           color: var(--secondary-text-color)
                      image: cards/wetter_animated/bgwettertr.png
                      
                      

                      Die original Karte mit den Animierten Icons hat nicht die größte Auswahl an Icons.
                      Habe versucht alles so passend wie möglich zuzuordnen.
                      Wenn irgendwo etwas nicht passt einfach melden.
                      Evtl findet ja auch jmd in der original Karte das Mapping. Ich habe nichts gefunden.

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

                      Meine Tabellen für eure Visualisierung klick

                      1 Reply Last reply
                      3
                      • E Offline
                        E Offline
                        Erstam
                        Developer
                        wrote on last edited by
                        #196

                        Hallo zusammen,

                        ich erlebe gerade ein merkwürdiges Problem in Zusammenhang mit der apexcharts-Card. Abhängig davon, ob ich im Konfigurationsmodus oder im Ansichtsmodus bin, zeigt das Diagramm unterschiedliche Werte an. Die richtigen Werte bekomme ich nur im Konfigurationsmodus zu sehen, die Werte im Ansichtsmodus sind falsch.

                        Hier der Vergleich:
                        Konfigurationsmodus
                        2bdd99a4-715f-4d81-bdec-3184d9a0fc64-image.png

                        Ansichtsmodus
                        b5f038e8-9cd1-4895-946e-9186dfa76ed0-image.png

                        Das einzige, was ich zwischen den beiden Screenshots geändert habe, war, den Konfigurationsmodus über die Schaltfläche "Fertig" zu verlassen.

                        Hat irgendwer eine Idee, wie ich die korrekten Werte im Ansichtsmodus angezeigt bekomme oder woran das Problem überhaupt liegen kann?

                        Viele Grüße!

                        Marc

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

                          Hallo zusammen,

                          ich erlebe gerade ein merkwürdiges Problem in Zusammenhang mit der apexcharts-Card. Abhängig davon, ob ich im Konfigurationsmodus oder im Ansichtsmodus bin, zeigt das Diagramm unterschiedliche Werte an. Die richtigen Werte bekomme ich nur im Konfigurationsmodus zu sehen, die Werte im Ansichtsmodus sind falsch.

                          Hier der Vergleich:
                          Konfigurationsmodus
                          2bdd99a4-715f-4d81-bdec-3184d9a0fc64-image.png

                          Ansichtsmodus
                          b5f038e8-9cd1-4895-946e-9186dfa76ed0-image.png

                          Das einzige, was ich zwischen den beiden Screenshots geändert habe, war, den Konfigurationsmodus über die Schaltfläche "Fertig" zu verlassen.

                          Hat irgendwer eine Idee, wie ich die korrekten Werte im Ansichtsmodus angezeigt bekomme oder woran das Problem überhaupt liegen kann?

                          Viele Grüße!

                          Marc

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

                          @erstam

                          Vorab, ich habe keine Idee.... .
                          Haben die normale Karten bei dem Datenpunkt das selbe Verhalten?

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

                          Meine Tabellen für eure Visualisierung klick

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

                            @erstam

                            Vorab, ich habe keine Idee.... .
                            Haben die normale Karten bei dem Datenpunkt das selbe Verhalten?

                            E Offline
                            E Offline
                            Erstam
                            Developer
                            wrote on last edited by Erstam
                            #198

                            @david-g : Nein, das habe ich bisher nur in der apexcharts-Card bemerkt. Ich hatte mir zur Sicherheit den Sensor noch in eine Entity Card gepackt, aber da erscheint er unabhängig vom Ansichtszustand richtig.

                            Hab mal bei Github in die Issues der apexcharts-Card geschaut. Da gibt es schon mehrere Bugberichte, die sich auf die Darstellung in verschiedenen Diagrammtypen beziehen. Zwar noch nichts spezifisches, was zwischen Konfigurationsmodus und Ansichtsmodus unterscheidet, aber das könnte trotzdem irgendwie zusammenhängen.

                            ? 1 Reply Last reply
                            0
                            • E Erstam

                              @david-g : Nein, das habe ich bisher nur in der apexcharts-Card bemerkt. Ich hatte mir zur Sicherheit den Sensor noch in eine Entity Card gepackt, aber da erscheint er unabhängig vom Ansichtszustand richtig.

                              Hab mal bei Github in die Issues der apexcharts-Card geschaut. Da gibt es schon mehrere Bugberichte, die sich auf die Darstellung in verschiedenen Diagrammtypen beziehen. Zwar noch nichts spezifisches, was zwischen Konfigurationsmodus und Ansichtsmodus unterscheidet, aber das könnte trotzdem irgendwie zusammenhängen.

                              ? Offline
                              ? Offline
                              A Former User
                              wrote on last edited by
                              #199

                              @erstam hmm ja irgendwas stimmt mit der Karte nicht. Teste diese gerade weil ich die ganz cool finde von der Ansicht. Selbst wenn man zwei mal die selbe entity hat zeigt die davon verschiedene werte an 😰

                              Aber allgemein haut bei mir irgendwas nicht richtig in. Auf Safari sehe ich den Raw Editor und den editor der Karten nicht mehr und mit Firefox schon aber wenn ich da ein Wert ändern will schreibt die Tastatur spiegelverkehrt :man-bowing:

                              nukleuzN 1 Reply Last reply
                              0
                              • ? A Former User

                                @erstam hmm ja irgendwas stimmt mit der Karte nicht. Teste diese gerade weil ich die ganz cool finde von der Ansicht. Selbst wenn man zwei mal die selbe entity hat zeigt die davon verschiedene werte an 😰

                                Aber allgemein haut bei mir irgendwas nicht richtig in. Auf Safari sehe ich den Raw Editor und den editor der Karten nicht mehr und mit Firefox schon aber wenn ich da ein Wert ändern will schreibt die Tastatur spiegelverkehrt :man-bowing:

                                nukleuzN Offline
                                nukleuzN Offline
                                nukleuz
                                wrote on last edited by
                                #200

                                @ciddi89

                                Versuch mal den Cache in den Browsern zu löschen - zumindest war das Rückwärtsschreiben wieder ok…

                                Intel NUC -> ProxMox -> Debian -> ioBroker (Master)| RPI3B+ -> rtl_433 (Slave) | CCU2

                                ? 1 Reply Last reply
                                0
                                • nukleuzN nukleuz

                                  @ciddi89

                                  Versuch mal den Cache in den Browsern zu löschen - zumindest war das Rückwärtsschreiben wieder ok…

                                  ? Offline
                                  ? Offline
                                  A Former User
                                  wrote on last edited by
                                  #201

                                  @nukleuz danke, das hat zumindest schon mal das problem mit dem Rückwertsschreiben behoben. 🙂

                                  nukleuzN 1 Reply Last reply
                                  0
                                  • ? A Former User

                                    @nukleuz danke, das hat zumindest schon mal das problem mit dem Rückwertsschreiben behoben. 🙂

                                    nukleuzN Offline
                                    nukleuzN Offline
                                    nukleuz
                                    wrote on last edited by
                                    #202

                                    @ciddi89

                                    Bei mir tritt das häufiger auf, gerade wenn man mal wieder was umbaut… Aber so richtig reproduzieren konnte ich es auch noch nicht. Scheint aber ein HA Problem zu sein, denn in einer Testumgebung mit HAOS 9.5 tritt es ebenfalls auf.

                                    Ich war mal der Meinung, dass es durch die Rücklöschtaste am Zeilenanfang zu tun hat… Leg mich da aber nicht fest 🧐

                                    Intel NUC -> ProxMox -> Debian -> ioBroker (Master)| RPI3B+ -> rtl_433 (Slave) | CCU2

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

                                      @m1r0o

                                      Für dich wäre vermutlich nur der kurze Part interessant.

                                      Zeug doch mal den Inhalt der Datenpunkte die mit dem Video zu tun haben. Evtl hilft das ja schon weiter.

                                      M Offline
                                      M Offline
                                      M1R0O
                                      wrote on last edited by
                                      #203

                                      @david-g @XBiT
                                      Danke für eure Hilfe. Ich habe es mit der Website-Karte gelöst und das reicht mir vorerst. Habe da gerade keinen Nerv, mich einzuarbeiten.

                                      ich treibt gerade eine RGBW- oder Dimm-Karte in Verbindung mit Shelly um. Da habe ich noch keine zufriedenstellende Lösung gefunden.

                                      GarfonsoG 1 Reply Last reply
                                      0
                                      • M M1R0O

                                        @david-g @XBiT
                                        Danke für eure Hilfe. Ich habe es mit der Website-Karte gelöst und das reicht mir vorerst. Habe da gerade keinen Nerv, mich einzuarbeiten.

                                        ich treibt gerade eine RGBW- oder Dimm-Karte in Verbindung mit Shelly um. Da habe ich noch keine zufriedenstellende Lösung gefunden.

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

                                        @m1r0o
                                        shelly dazu prügeln, dass die Geräte vom type-detector (also "Geräte" Tab im Admin) erkannt werden, dann kriegst du auch ordentliche light entities automatisch generiert und dann einfach das in lovelace eingebaute nehmen. 🙂

                                        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

                                        M 1 Reply Last reply
                                        0
                                        • S Offline
                                          S Offline
                                          Scrub
                                          wrote on last edited by
                                          #205

                                          Hallo zusammen,

                                          Ich reiche einmal meine Fragen aus dem anderen Thread hierher weiter:

                                          Eigentlich bin ich mit meinem vorläufigen Ergebnis, das nur einen simplen Ein- und Aus-Schalter beinhaltet, schon recht zufrieden. Allerdings habe ich ein Problem ausgemacht, zu dem ich nun gerne ein paar Profi-Tipps hätte:
                                          Ich habe auf dem Home-Screen drei Schaltflächen mit den drei Shellys eingebunden. Das klappt auch richtig super. Allerdings besteht die große Gefahr, aus Versehen beim Antippen des Displays einen der Schalter zu betätigen und damit beispielsweise den angeschlossenen PC im Betrieb abzuschießen. Kann ich eine Sicherheitsabfrage ("Willst du wirklich ausschalten?") einbauen, die nur beim Ausschalten abfrägt?

                                          Und die zweite Frage: Wie realisiere ich eine verbrauchsgesteuerte Abschaltung ("Wenn für 15 Minuten weniger als 50 Watt verbraucht werden, schalte selbständig ab")? Brauche ich da Blockly?

                                          David G.D 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

                                          155

                                          Online

                                          32.4k

                                          Users

                                          81.3k

                                          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