Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. Widget "basic - ValueList HTML Style" auch für Wertebereiche?

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    Widget "basic - ValueList HTML Style" auch für Wertebereiche?

    This topic has been deleted. Only users with topic management privileges can see it.
    • P
      pix last edited by

      Hallo,

      ein Lösung ist die Nutzung eines VIS Bindings. Da wird der Name eines Objektes direkt im Einstellungsfenster von VIS mit geschweiften Klammern angegeben. Das Objekt wird in einem Skript im Javascript Adapter erstellt.

      Beispiel für ein Script in der Javascript-Instanz 0:

      var idFarbe = "javascript.0.VIS.Jalousie";
      var idAktor = "hm-rpc.0.NEQ0394278.1.LEVEL";
      
      createState(idFarbe, 'white', {
          def: 'white',
          type: 'string',
          role: 'text'
      });
      
      on(idAktor, function (data) {
          if (data.state.val === 0) setState(idFarbe, 'green');
          else if (data.state.val > 0   && data.state.val <= 50)   setState(idFarbe, 'orange');
          else if (data.state.val > 50 && data.state.val <= 100) setState(idFarbe, 'red');
      });
      
      

      Dann im VIS Widget unter Background-Color einfach````
      {javascript.0.VIS.Jalousie}

      
      Gruß
      
      Pix
      M 1 Reply Last reply Reply Quote 0
      • D
        dtp last edited by

        Oh, super. Danke. Das werde ich mal ausprobieren.

        Gruß,

        Thorsten

        1 Reply Last reply Reply Quote 0
        • K
          kekz last edited by

          @pix:

          Dann im VIS Widget unter Background-Color einfach{javascript.0.VIS.Jalousie}eintragen. `
          Hey,

          toller Tipp, danke! 🙂

          Ich habe gerade auch nach genau so einer Lösung gesucht, allerdings für Temperaturbereiche, und es direkt einmal ausprobiert im Metro Widget TileBool und TileState.

          Leider wird mir lediglich der Rahmen des Widgets in der definierten Farbe dargestellt, nicht aber der Hintergrund.

          Der wird nur in der über das Dropdown-Menü gewählten Farbe dargestellt.

          Funktioniert das möglicherweise nicht bei den metro-widgets?

          Grüße.

          1 Reply Last reply Reply Quote 0
          • D
            dtp last edited by

            Bei mir funktioniert es leider nicht. Gebe ich die Farbe direkt unter "background" oder "color" des Widgets ein, wird der Hintergrund entsprechend angezeigt. Gebe ich den Bezug zum Datenpunkt ein, passiert nichts, obwohl dieser dank des obigen Skripts auf "green", "orange" oder "red" steht.

            Gruß,

            Thorsten

            1 Reply Last reply Reply Quote 0
            • P
              pix last edited by

              Hallo Torsten,

              wenn das Objekt "javascript.0.VIS.Jalousie" vom Skript korrekt gefüllt wurde, steht ja eine Farbe in englischer Sprache drin. Kannst du das im Admin Objektreiter sehen?

              Durch die Verwendung der geschweiften Klammern, lässt sich der Inhalt des Datenpunktes dann in jedem Eingabe-Feld des VIS Editors nutzen (ausser CSS und Skript). Das heißt dann https://github.com/ioBroker/ioBroker.vis#bindings-of-objects! Also so: 261_bildschirmfoto_2017-07-16_um_12.37.42.jpg

              Die Änderung sieht man natürlich nicht im Edit-Modus, sondern nur im Runtime.

              Gruß

              Pix

              1 Reply Last reply Reply Quote 0
              • D
                dtp last edited by

                So,

                nun klappt es. Allerdings nicht mit dem "ValueList HTML Style"-Widget, sondern mit dem normalen "HTML"-Widget.

                Gruß,

                Thorsten

                1 Reply Last reply Reply Quote 0
                • D
                  dtp last edited by

                  Ich bin gerade im verzweifeln. Ich habe eingentlich nichts anderes gemacht, als die Datenpunkte für die Hintergründe umbenannt.

                  996_2018-02-11_14h36_31.png

                  Doch nun wird für einige von ihnen nicht mehr die Hintergrund-Farbe korrekt im Widget angezeigt.

                  996_2018-02-11_14h37_48.png

                  996_2018-02-11_14h38_15.png

                  Hat jemand eine Idee, woran das liegen könnte? Bisher hat das immer einwandfrei funktioniert.

                  Seltasm ist auch, dass eine 1:1-Kopie des obersten Widgets, bei dem der Hintergrund ja korrekt angezeigt wird, nicht mehr funktioniert. Da bleibt der Hintergrund dann einfach weg.

                  Gruß,

                  Thorsten

                  1 Reply Last reply Reply Quote 0
                  • D
                    dtp last edited by

                    So, geht wieder. Ich musste den Wert unter "color" eintragen.

                    Gruß,

                    Thorsten

                    1 Reply Last reply Reply Quote 0
                    • D
                      dtp last edited by

                      Da hatte ich mich gestern doch etwas zu früh gefreut. Nachdem ich nämlich noch mal einen Datenpunkt geändert hatte, wurde sein Wert wieder nicht korrekt übernommen.

                      Vielleicht liegt da auch dem Material-CSS-Style, den ich verwende. So ganz einwandfrei läuft der nämlich nicht.

                      Bis dann,

                      Thorsten

                      1 Reply Last reply Reply Quote 0
                      • D
                        dtp last edited by

                        Also ich bin gestern fast an die Decke gegangen, so sehr hat mich das "HTML basic"-Widget geärgert.

                        Kurz vorweg. Ich arbeite mit dem vis-Editor in der aktuellen Version im ebenfalls aktuellen Firefox-Browser.

                        Ich habe mir in meinen View ein leeres "HTML basic"-Widget gezogen und diese in Größe, z-Index und Randeinstellungen an meine Bedürfnisse angepasst. Dann habe ich mir mehrere Kopien davon durch Klick auf den Kopieren- und den Haken-Button oben links erzeugt. So weit, so gut.

                        Danach habe ich mir die benötigten Datenpunkte, die jeweils nach Wertebereich nur die Werte "green", "orange" und "royalblue" aufweisen können, kopiert und sie in geschweiften Klammern in das Feld "Background" eingefügt. Das war's eigentlich schon.

                        Das Ergebnis habe ich mir dann im Firefox und in der ioBroker.vis App angesehen. Doch leider wurden die Hintergründe nicht entsprechend den Werten angezeigt. Also bin ich wieder in den Editor. Und was musste ich feststellen. In den Feldern "Background" und "Color" waren plötzlich ganz andere Datenpunkte eingetragen. Keine Ahnung, wo die her kamen. Es waren zum Teil Datenpunkte, die ich zuvor umbenannt hatte und die so gar nicht mehr existieren. Das war bei allen kopierten Widgets so.

                        Wie kann das sein? Ist das ein Bug des vis-Editors oder mache ich da was falsch?

                        Ansonsten funktioniert eigentlich alles, wie gewünscht.

                        Gruß,

                        Thorsten

                        1 Reply Last reply Reply Quote 0
                        • J
                          jan_xx last edited by

                          Hallo, ich bin noch Anfänger und muss hier mal eine doofe Frage stellen, sieht man irgendwo ob das script läuft?

                          Muss ich einen zusätzlichen Adapter installieren oder reicht das wenn ich den quellcode einfach unter scripte eintrage?

                          Danke & Gruß Jan

                          1 Reply Last reply Reply Quote 0
                          • M
                            markusk1407 @pix last edited by

                            Hallo! Ich habe da Script von @pix kopiert und nach meinen Bedürfnissen verändert. Leider steht in der Variable hinterher immer nur white. Hat vielleicht jemand eine Idee?

                            var idFarbe = "javascript.0.VIS.Heizung_WZ";
                            
                            var idAktor = "bshb.0.hdm:HomeMaticIP:3014F711A000005BB85E44BD.ValveTappet.position";
                            
                             
                            
                            createState(idFarbe, 'white', {
                            
                                def: 'white',
                            
                                type: 'string',
                            
                                role: 'text'
                            
                            });
                            
                            on(idAktor, function (data) {
                            
                                if (data.state.val == 0) setState(idFarbe, 'linear-gradient(0deg, rgba(49,155,219,1) 0%, rgba(82,205,192,1) 100%)');
                            
                                else if (data.state.val > 0 && data.state.val <= 50) setState(idFarbe, 'linear-gradient(0deg, rgba(253,183,103,1) 0%, rgba(253,238,117,1) 100%)');
                            
                                else if (data.state.val > 50 && data.state.val <= 100) setState(idFarbe, 'linear-gradient(0deg, rgba(255,103,106,1) 0%, rgba(255,143,101,1) 100%)');
                            
                            });
                            

                            LG Markus

                            1 Reply Last reply Reply Quote 0
                            • First post
                              Last post

                            Support us

                            ioBroker
                            Community Adapters
                            Donate

                            434
                            Online

                            31.9k
                            Users

                            80.1k
                            Topics

                            1.3m
                            Posts

                            5
                            13
                            6153
                            Loading More Posts
                            • Oldest to Newest
                            • Newest to Oldest
                            • Most Votes
                            Reply
                            • Reply as topic
                            Log in to reply
                            Community
                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                            The ioBroker Community 2014-2023
                            logo