Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Praktische Anwendungen (Showcase)
    4. Einfach mal zeigen will….. :-) - Teil 2

    NEWS

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

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

    Einfach mal zeigen will….. :-) - Teil 2

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

      Hier mal ein kleines Video meiner aktuellen Views:

      996_iobroker_vis_dtp_201812.gif

      Die teilweise zu sehenden "Scheinbilder" sind wohl durch die Komprimierung von Screenpresso entstanden. Im Original sind die Views "sauber". 😉

      1 Reply Last reply Reply Quote 0
      • H
        Holzwurm1976 last edited by

        Hallo,

        weiß hier jemand von wem das Star Trek Design ist, welches unter iobroker.click zu finden ist?

        Besten Dank und viele Grüße

        André

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

          steht in adapter - info. ( wenn ich mich nicht irre )

          1 Reply Last reply Reply Quote 0
          • haselchen
            haselchen Most Active last edited by

            Meinst Du das hier?

            3723_unbenannt.png

            Einfach den Autor anschreiben 😄

            1 Reply Last reply Reply Quote 0
            • wendy2702
              wendy2702 last edited by

              @dtp:

              Hier mal ein kleines Video meiner aktuellen Views:

              filename="ioBroker_vis_dtp_201812.gif" index="0">~~

              Die teilweise zu sehenden "Scheinbilder" sind wohl durch die Komprimierung von Screenpresso entstanden. Im Original sind die Views "sauber". 😉 `

              Hi,

              Was nutzt du zur Anzeige? Tablet, Pc?

              Danke

              Gesendet von iPhone mit Tapatalk Pro

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

                Ich wurde gefragt, wie ich das mit den täglichen Strom-, Gas- und Wasserständen realisiert habe.

                Nun, zunächst erfasse ich diese mit jeweils einer HomeMatic Zählersensor-Sendeeinheit, HM-ES-TX-WM, samt passendem Cyble-Sensor. https://homematic-forum.de/forum/viewtopic.php?f=31&t=30606#p279598 hatte ich mal die zugehörigen Skripte für die HomeMatic beschrieben. Das ist aber eigentlich für vis von zweitrangiger Bedeutung.

                Mit dem nachfolgenden Javaskript erfasse ich täglich um 23:58 Uhr die Tageszählerstände aus den in der HomeMatic angelegten Systemvariablen für die entsprechenden Tagesverbräuche und erzeuge nachfolgend mit dem phantomjs-Adapter um 23:59 Uhr einen Screenshot der per SQL-Adapter gespeicherten und per FLOT-Adapter erstellten Diagramme.

                var path = 'javascript.'+instance+'.vis.'; // Pfad der String-Datenpunkte
                var listd = ['VerbrauchStromTag','VerbrauchGasTag','VerbrauchWasserTag'];
                for(i = 0; i < listd.length; i++){
                  createState(path+listd[i], 0, {
                    read: true,
                    write: true,
                    name: 'Tagesverbrauchswert',
                    type: 'string',
                    def: '0'
                  });
                }
                 schedule('10 58 23 * * *', function(){//
                  setState(path+listd[0], getState('hm-rega.0.5483').val + ' kWh'); // Strom
                  setState(path+listd[1], getState('hm-rega.0.5482').val + ' m%B3'); // Gas
                  setState(path+listd[2], getState('hm-rega.0.5584').val + ' m%B3'); // Wasser
                });
                 schedule('20 59 23 * * *', function(){
                  sendTo('phantomjs.0', 'send', {
                      url: 'http://localhost:8082/flot/index.html?l%5B0%5D%5Bid%5D=javascript.0.vis.VerbrauchStromTag&l%5B0%5D%5Boffset%5D=0&l%5B0%5D%5Baggregate%5D=minmax&l%5B0%5D%5Bcolor%5D=%23FFD500&l%5B0%5D%5Bthickness%5D=2&l%5B0%5D%5Bshadowsize%5D=2&l%5B0%5D%5BchartType%5D=bar&l%5B0%5D%5BignoreNull%5D=true&l%5B0%5D%5Bmin%5D=0&l%5B0%5D%5BafterComma%5D=1&l%5B0%5D%5Bfill%5D=0.5&l%5B0%5D%5Bunit%5D=kWh&l%5B0%5D%5Bxaxe%5D=top&timeType=relative&relativeEnd=now&range=20160&aggregateType=count&width=600&height=300&noBorder=noborder&window_bg=rgb(86%2C+86%2C+86)&bg=rgba(128%2C+128%2C+128%2C+1)&titleColor=rgb(0%2C+0%2C+0)&titleSize=18&hoverDetail=true&timeFormat=%25a&useComma=true&zoom=true&noedit=true&animation=0&grid_color=rgba(214%2C+214%2C+214%2C+0.85)&legBg=rgb(255%2C+255%2C+255)&x_labels_color=rgb(255%2C+255%2C+255)&y_labels_color=rgb(255%2C+255%2C+255)&barWidth=0.6&barFontSize=10&barFontColor=%23ffffff&barLabels=topover&aggregateSpan=300',
                      output: '/opt/iobroker/phantomjs_images/Stromverbrauch.png',
                      width: 1024,
                      height: 768,
                      'clip-width': 600,
                      'clip-height': 300
                  }, function (result) {
                      console.log(result.error + ' ' + result.output);
                  });
                
                  sendTo('phantomjs.0', 'send', {
                      url: 'http://localhost:8082/flot/index.html?l%5B0%5D%5Bid%5D=javascript.0.vis.VerbrauchGasTag&l%5B0%5D%5Boffset%5D=0&l%5B0%5D%5Baggregate%5D=minmax&l%5B0%5D%5Bcolor%5D=%23FF5A00&l%5B0%5D%5Bthickness%5D=2&l%5B0%5D%5Bshadowsize%5D=2&l%5B0%5D%5BchartType%5D=bar&l%5B0%5D%5BignoreNull%5D=true&l%5B0%5D%5Bmin%5D=0&l%5B0%5D%5BafterComma%5D=2&l%5B0%5D%5Bunit%5D=m%C2%B3&l%5B0%5D%5Bfill%5D=0.5&l%5B0%5D%5Bxaxe%5D=top&timeType=relative&relativeEnd=now&range=20160&aggregateType=count&width=600&height=300&noBorder=noborder&window_bg=rgb(86%2C+86%2C+86)&bg=rgba(128%2C+128%2C+128%2C+1)&titleColor=rgb(0%2C+0%2C+0)&titleSize=18&hoverDetail=true&timeFormat=%25a&useComma=true&zoom=true&noedit=true&animation=0&grid_color=rgba(214%2C+214%2C+214%2C+0.85)&legBg=rgb(255%2C+255%2C+255)&x_labels_color=rgb(255%2C+255%2C+255)&y_labels_color=rgb(255%2C+255%2C+255)&barWidth=0.6&barFontSize=10&barFontColor=%23ffffff&barLabels=topover&aggregateSpan=300',
                      output: '/opt/iobroker/phantomjs_images/Gasverbrauch.png',
                      width: 1024,
                      height: 768,
                      'clip-width': 600,
                      'clip-height': 300
                  }, function (result) {
                      console.log(result.error + ' ' + result.output);
                  });
                   sendTo('phantomjs.0', 'send', {
                      url: 'http://localhost:8082/flot/index.html?l%5B0%5D%5Bid%5D=javascript.0.vis.VerbrauchWasserTag&l%5B0%5D%5Boffset%5D=0&l%5B0%5D%5Baggregate%5D=minmax&l%5B0%5D%5Bcolor%5D=%230F00FF&l%5B0%5D%5Bthickness%5D=2&l%5B0%5D%5Bshadowsize%5D=2&l%5B0%5D%5BchartType%5D=bar&l%5B0%5D%5BignoreNull%5D=true&l%5B0%5D%5Bmin%5D=0&l%5B0%5D%5BafterComma%5D=2&l%5B0%5D%5Bfill%5D=0.5&l%5B0%5D%5Bunit%5D=m%C2%B3&l%5B0%5D%5Bxaxe%5D=top&timeType=relative&relativeEnd=now&range=20160&aggregateType=count&width=600&height=300&noBorder=noborder&window_bg=rgb(86%2C+86%2C+86)&bg=rgba(128%2C+128%2C+128%2C+1)&titleColor=rgb(0%2C+0%2C+0)&titleSize=18&hoverDetail=true&timeFormat=%25a&useComma=true&zoom=true&noedit=true&animation=0&grid_color=rgba(214%2C+214%2C+214%2C+0.85)&legBg=rgb(255%2C+255%2C+255)&x_labels_color=rgb(255%2C+255%2C+255)&y_labels_color=rgb(255%2C+255%2C+255)&barWidth=0.6&barFontSize=10&barFontColor=rgb(255%2C+255%2C+255)&barLabels=topover&aggregateSpan=300',
                      output: '/opt/iobroker/phantomjs_images/Wasserverbrauch.png',
                      width: 1024,
                      height: 768,
                      'clip-width': 600,
                      'clip-height': 300
                  }, function (result) {
                      console.log(result.error + ' ' + result.output);
                  });
                });
                

                Das mit dem phantomjs-Adapter kann man auch weglassen, da es lediglich für den nachträglichen Versand der Screenshots per Push-Nachricht von Bedeutung ist.
                Hier mal zwei Screenshots für die Flot-Einstellungen für den Parameter "javascript.0.vis.VerbrauchStromTag".
                996_2018-12-31_11h56_24.png
                996_2018-12-31_11h57_29.png
                Gruß,
                Thorsten

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

                  @wendy2702:

                  Was nutzt du zur Anzeige? Tablet, Pc? `

                  Sowohl, als auch. 😉

                  Primär nutze ich ein Wandtablet. Dieses hängt im Flur des EG und ist 24/7 eingeschaltet (auch der Screen). Hab noch ein zweites mit entsprechendem Rahmen, doch im Moment habe ich noch keine Idee, wo ich das am besten im Haus platziere.

                  996_wandtablet_dtp_01.jpg
                  996_wandtablet_dtp_02.jpg

                  Die beiden Tablets sind Lifetab P9701 von Mediom, die von den Abmessungen her mit denen eines iPad mit 9,7"-Screen nahezu perfekt übereinstimmen. So kann ich die Rahmen problemlos auch mal für entsprechende iPads verwenden.

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

                    sehr schön !

                    1 Reply Last reply Reply Quote 0
                    • I
                      IOkev last edited by Jey Cee

                      Ich bin anfänger in VIS. Ich würde gerne an der seite ein Paar Buttons erstellen mit Bildern im Hintergrund. Ich würde dafür Vie Bars nehmen weil ich damit auf meine anderen Views umschalten möchte. Wie kann ich als Hintergrund bei den Buttons bilder machen so wie du? Wie bekomme ich so etwas wie auf dem Bild im anhang aus diesem Beitrag weitervorn hin?MFG Kev
                      14780_screenshot_20181115-212218.jpg

                      1 Reply Last reply Reply Quote 0
                      • Homoran
                        Homoran Global Moderator Administrators last edited by

                        @IOkev:

                        Wie kann ich als Hintergrund bei den Buttons bilder machen so wie du? `

                        So:
                        144_knoepfe.png

                        Gruß

                        Rainer

                        1 Reply Last reply Reply Quote 0
                        • I
                          IOkev last edited by

                          Danke das hatte ich schon rausgefunden, aber bei dem Beispiel sieht man ja ist der Hintergrund quasi das Bild. Wenn ich bei dem Knopf ein Bild einfüge kann ich es nicht voll machen? Mit freundlichen Grüßen kev

                          1 Reply Last reply Reply Quote 0
                          • I
                            IOkev last edited by

                            Also ich würde zum Beispiel nur einen Knopf machen wollen mit dem Name Wohnzimmer am Rand und als Hintergrund ein Bild vom Wohnzimmer. Da kann ich dann drauf drücken und komme von der Hauptseite zu dem Wohnzimmer view. Oben bei dem Beispiel ist es wahrscheinlich ein Bild als Hintergrund und dann wurden die Knöpfe vorn drauf gelegt?! Mfg Kevin

                            1 Reply Last reply Reply Quote 0
                            • Jeeper.at
                              Jeeper.at last edited by

                              Mache einfach ein Bild dahinter. Du kannst immer mehrere Widgets übereinanderlegen. Die Ebene steuerst du über den Z-Index.

                              Je höher desto weiter vorne.

                              1 Reply Last reply Reply Quote 0
                              • I
                                IOkev last edited by Jey Cee

                                Danke, habe das gleich ausprobiert. das geht, aber ich müsste bei dem Button den Hintergrund auf Transparent machen, das geht aber nicht. weil wenn ich das Bild nach vorne mache kann ich den button nicht mehr betätigen. Auf dem bild sieht man was ich meine, das Bild habe ich nur zur ansicht daneben plaziert, weil es ja dahinter nicht sichtbar ist.
                                14780_2019-01-01_13h33_37.png

                                1 Reply Last reply Reply Quote 0
                                • Jeeper.at
                                  Jeeper.at last edited by

                                  Du kannst bei dem Color Tag bei den Buttons „transparent“ (ohne die Quotes) eintragen.

                                  1 Reply Last reply Reply Quote 0
                                  • H
                                    Holzwurm1976 last edited by

                                    @haselchen:

                                    Meinst Du das hier?

                                    Unbenannt.PNG

                                    Einfach den Autor anschreiben 😄 `

                                    genau die meinte ich…

                                    1 Reply Last reply Reply Quote 0
                                    • L
                                      lesiflo Most Active last edited by Jey Cee

                                      Hallo zusammen und ein frohes neues Jahr auch noch,

                                      unter viewtopic.php?f=35&t=13917&start=60#p154795 hatte ich ja schon mal meine view eingestellt. Da es immer mal wieder was zu erweitern/verändern/erneuern gibt stelle ich mal wieder was neues ein. Wem's gefällt und etwas davon haben möchte einfach melden.

                                      Gruß

                                      Axel
                                      2716_bad.jpg 2716_einstellungen.jpg 2716_backup.jpg 2716_fenster.jpg 2716_haustechnik.jpg 2716_licht.jpg 2716_robby.jpg 2716_wohnen.jpg 2716_heizung.jpg

                                      1 Reply Last reply Reply Quote 0
                                      • arteck
                                        arteck Developer Most Active last edited by

                                        der Sauger sieht gut aus.. könntest du mal ein Export zur Verfügung stellen

                                        1 Reply Last reply Reply Quote 0
                                        • L
                                          lesiflo Most Active last edited by Jey Cee

                                          @arteck:

                                          der Sauger sieht gut aus.. könntest du mal ein Export zur Verfügung stellen `

                                          Hier die Dateien,

                                          sind insgesamt 4 Subviews die in Hauptview eingebaut sind.

                                          2716_saugroboter.rar

                                          1 Reply Last reply Reply Quote -1
                                          • H
                                            Holzwurm1976 last edited by

                                            @lesiflo:

                                            Hallo zusammen und ein frohes neues Jahr auch noch,

                                            unter viewtopic.php?f=35&t=13917&start=60#p154795 hatte ich ja schon mal meine view eingestellt. Da es immer mal wieder was zu erweitern/verändern/erneuern gibt stelle ich mal wieder was neues ein. Wem's gefällt und etwas davon haben möchte einfach melden.

                                            Gruß

                                            Axel

                                            Bad.JPG

                                            Einstellungen.JPG

                                            Backup.JPG

                                            Fenster.JPG

                                            Haustechnik.JPG

                                            Licht.JPG

                                            Robby.JPG

                                            Wohnen.JPG

                                            Heizung.JPG `

                                            Hallo Axel,

                                            könntest Du auch das gesamte Projekt zur Verfügung stellen?

                                            Sieht echt toll aus…

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            524
                                            Online

                                            31.7k
                                            Users

                                            79.8k
                                            Topics

                                            1.3m
                                            Posts

                                            185
                                            916
                                            380958
                                            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