Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Tester
    4. jarvis v2.2.0 - just another remarkable vis

    NEWS

    • 15. 05. Wartungsarbeiten am ioBroker Forum

    • Monatsrückblick - April 2025

    • Minor js-controller 7.0.7 Update in latest repo

    jarvis v2.2.0 - just another remarkable vis

    This topic has been deleted. Only users with topic management privileges can see it.
    • M
      MCU @eastcoast last edited by

      @eastcoast
      Du musst einen DP in ioBroker haben mit der URL:
      5628237c-0fe5-4f3a-bc02-73de8533bc89-image.png
      Und den dann entsprechend in jarvis als Gerät definieren und im displayimage zuordnen.

      E 1 Reply Last reply Reply Quote 1
      • E
        eastcoast @MCU last edited by eastcoast

        @mcu
        Danke für den Tipp!
        Schade dass es nicht mehr so einfach ist wie in v2.2.0 bzw. beim 'iFrame' Module einfach den Datenpunkt/URL direkt zu konfigurieren.
        Screenshot 2021-07-28 131842.jpg

        M 1 Reply Last reply Reply Quote 0
        • M
          MCU @eastcoast last edited by

          @eastcoast Man ist ja erst im Alpha. also abwarten. Da tut sich noch einiges bis zur stable Version.

          1 Reply Last reply Reply Quote 0
          • L
            LoDDl @MCU last edited by

            @mcu said in jarvis v2.2.0 - just another remarkable vis:

            Besondere Highlights für besondere Werte
            https://www.youtube.com/watch?v=-Rv1dbvM1EY

            Zu sehen, Umschaltung von einem TAB zum Effekt-TAB, Effekt wird nur 3x angezeigt mit zusätzlichem Blink-Effekt.
            jarvis_v222-besondereWerte.gif

            Selektiertes TAB besser sichtbar machen:
            jarvis_v222-TAB-BackgroundSelected.gif

            .MuiTab-wrapper:hover
            { 
              background-color: #00ff00;   
              color: black;
              // font-size: 80%;
              font-weight:bold;
              outline: dotted white;
            }
            
            [aria-selected = 'true'] [role='img'] 
            {   
              background-color: #00ff00;
              color: black;
            }
            
            [aria-selected = 'true'] 
            { 
              background-color: #00ff00;
              color: black;
            }
            
            .MuiTab-wrapper:active
            {   
              background-color: #00ff00;
            }
            

            kannst du noch den Style für diesen "Snake-Effekt" teilen? Das Video macht mich nur bedingt schlauer 😄

            M 1 Reply Last reply Reply Quote 0
            • M
              MCU @LoDDl last edited by

              @loddl
              Datenpunkt-Stil

              {"false":{"color":"red","font-weight":"bold","text-shadow":"0 0 5px black;"}}
              

              Anzeigevariante (blink5 kann man auch weg lassen)

              {"false":"<div class='card'><span></span><span></span><span></span><span></span><div class='content blink5'><p>Nicht aktiv</p></div></div>","true":"<a href='https://www.google.de'>GoogleDE</a>"}
              

              Styles (für mehrere Durchgänge muss man die Anzahl anpassen: 3 forwards)

              
              .card 
              {
               position: relative;
               width: auto;
               height: 25px;
               display:flex;
               justify-content: center;
               align-items: center;
               margin: 0px;
               overflow:hidden;
              }
              
              .card .content 
              {
               padding: 10px;
               text-align: center;
              }
              
              .card span
              {
               transition: 1;
              }
              
              .card span:nth-child(1) 
              {
               position: absolute;
               top:0;
               left:0;
               width:100%;
               height:3px;
               background: linear-gradient(to right, transparent, red);
               animation: animate1 2s linear 3 forwards;
              }
              @keyframes animate1
              {  
               0% { transform: translateX(-100%);}
               100% { transform: translateX(100%);}
              }
              
              .card span:nth-child(2)
              {
               position: absolute;
               top:0;
               right:0;
               width:3px;
               height:100%;
               background: linear-gradient(to bottom, transparent, red);
               animation: animate2 2s linear 3 forwards;
               animation-delay: 1s;
              }
              @keyframes animate2
              {  
               0% { transform: translateY(-100%);}
               100% { transform: translateY(100%);}
              }
              
              .card span:nth-child(3) 
              {  
               position: absolute;  
               bottom:0;
               left:0;
               width:100%;
               height:3px;
               background: linear-gradient(to left, transparent, red);
               animation: animate3 2s linear 3 forwards;
              }
              @keyframes animate3
              {
               0% { transform: translateX(100%);}
               100% { transform: translateX(-100%);}
              }
              
              .card span:nth-child(4) 
              {
               position: absolute;
               top:0;
               left:0;
               width:3px;
               height:100%;
               background: linear-gradient(to top, transparent, red);
               animation: animate4 2s linear 3 forwards;
               animation-delay: 1s;
              }
              @keyframes animate4
              {
               0% { transform: translateY(100%);}
               100% { transform: translateY(-100%);}
              }
              
              

              L 1 Reply Last reply Reply Quote 2
              • L
                LoDDl @MCU last edited by

                @mcu vielen Dank! 🙂

                1 Reply Last reply Reply Quote 0
                • A
                  Algie last edited by

                  Hallo,

                  ich habe jarvis vor kurzem erst entdeckt und bin begeistert.
                  Beim umsetzen meiner Visualisierung habe ich eine Frage. Ist es möglich die Spritpreise ohne VIS und iFrame so darzustellen?

                  eb7698d1-9801-4ed2-baf7-b0ac413f5dd8-image.png
                  Also die dritte Dezimalzahl erhöht?

                  M 1 Reply Last reply Reply Quote 0
                  • M
                    MCU @Algie last edited by MCU

                    @algie
                    Würde es so reichen?
                    3085563c-6883-4b99-ab93-85db47603e55-image.png
                    Vorraussetzung ist, die Zahl hat immer den Aufbau x.xxx

                    {"value":"val => String(val).substr(0,4)+'<sup>'+String(val).substr(4,1)+'</sup>' + ' €'"}
                    

                    92bae155-eae9-4575-b0a1-0989a27f2b8c-image.png

                    A 1 Reply Last reply Reply Quote 1
                    • A
                      Algie @MCU last edited by

                      @mcu perfekt, vielen Dank für die schnelle Hilfe.

                      Ist es möglich VIS-Seiten in Jarvis zu skalieren? Mit iFrame geht das nicht.

                      M 1 Reply Last reply Reply Quote 0
                      • M
                        MCU @Algie last edited by MCU

                        @algie Zeig mal Deine iFrame Einstellungen und die Anzeige.

                        A 2 Replies Last reply Reply Quote 0
                        • A
                          Algie @MCU last edited by

                          @mcu Bildschirmfoto 2021-08-03 um 17.10.37.png

                          1 Reply Last reply Reply Quote 0
                          • A
                            Algie @MCU last edited by

                            @mcu Bildschirmfoto 2021-08-03 um 17.12.58.png

                            Das ist die Anzeige. Wird abgeschnitten. Aber man kann nach links scrollen.
                            Ich möchte aber, dass die Seite auf die Widgetgröße angepasst wird.

                            M 1 Reply Last reply Reply Quote 0
                            • M
                              MCU @Algie last edited by

                              @algie
                              Setz mal hier 100% nicht 600px
                              4db68721-1983-4070-88e7-02b6528ffeb9-image.png

                              A 1 Reply Last reply Reply Quote 0
                              • A
                                Algie @MCU last edited by

                                @mcu ändert sich leider nichts.

                                M 1 Reply Last reply Reply Quote 0
                                • M
                                  MCU @Algie last edited by MCU

                                  @algie
                                  Hast du mal die Skalierung raus genommen? Und mal mit den Prozentwert versucht? Also mal 90% und so weiter.
                                  Dann auch in der Höhe mal mit Prozent oder geringere Höhe arbeiten?
                                  Oder in der VIS selbst das Element (Müll) verkleinern?

                                  R 1 Reply Last reply Reply Quote 0
                                  • R
                                    Renegade 0 @MCU last edited by

                                    Moin,

                                    hat sonst noch wer Probleme mit Jarvis 2.2.1 Uhrzeit und Wetter-Widget?
                                    403c3917-9c86-40f8-8c9e-c1464d03bf5d-image.png

                                    hab irgendwie immer diese Ladeanzeige drinnen.

                                    N 1 Reply Last reply Reply Quote 0
                                    • N
                                      neunteufels @Renegade 0 last edited by neunteufels

                                      @renegade-0

                                      Ich hatte das Problem beim Wetter-Widget dass die Icons nicht mehr angezeigt wurden.
                                      Ein Update auf 2.2.2 hat geholfen.

                                      Das Update wurde weiter oben schon mal diskutiert:
                                      https://forum.iobroker.net/post/654032

                                      lg

                                      1 Reply Last reply Reply Quote 0
                                      • R
                                        Renegade 0 last edited by

                                        @neunteufels
                                        OK, muss ich mal schauen, aber den daswetter.com Adapter brauche ich nicht im Broker oder?

                                        N 1 Reply Last reply Reply Quote 0
                                        • N
                                          neunteufels @Renegade 0 last edited by

                                          @renegade-0

                                          Kann ich nicht sagen, da ich den schon vor Jarvis in Verwendung hatte.

                                          R 1 Reply Last reply Reply Quote 0
                                          • R
                                            Renegade 0 @neunteufels last edited by

                                            @neunteufels
                                            Hast du das als Gerät importiert oder das weather widget verwendet?

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            1.0k
                                            Online

                                            31.6k
                                            Users

                                            79.5k
                                            Topics

                                            1.3m
                                            Posts

                                            jarvis material material ui materialdesign vis visualisierung visualization
                                            316
                                            6126
                                            3342132
                                            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