Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Praktische Anwendungen (Showcase)
    4. Vorstellung meiner VIS-Oberfläche

    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

    Vorstellung meiner VIS-Oberfläche

    This topic has been deleted. Only users with topic management privileges can see it.
    • Glasfaser
      Glasfaser @saeft_2003 last edited by Glasfaser

      @saeft_2003

      Das Thema hatte ich erst letztens .... es liegt nur an dem Popup Widget ... wiso warum 🤔 !?

      Link Text

      1 Reply Last reply Reply Quote 0
      • S
        saeft_2003 Most Active @Glasfaser last edited by

        @Glasfaser sagte in Vorstellung meiner VIS-Oberfläche:

        @saeft_2003

        Alle VIS Seiten von dir müssen auf das Thema umgestellt werden , erst dann funktioniert es mit dem PopUp Fenster !!

        Danke 😊 das war die Lösung 👍

        Was jetzt nur doof ist wenn ich schauen will welches Thema mir am besten gefällt muss ich jedes mal alle views umstellen?!

        Glasfaser 1 Reply Last reply Reply Quote 0
        • Glasfaser
          Glasfaser @saeft_2003 last edited by Glasfaser

          @saeft_2003

          Hier mit "dark-hive" ... da tut sich nicht viel ....

          ( In Spoiler gesetz ... damit der Thread klein bleibt 😉 )


          1.JPG


          2.JPG

          1 Reply Last reply Reply Quote 0
          • C
            Conquest last edited by

            @Negalein
            Sehr schöne VIS. Würdest du einen Export bereitstellen? Kann ich mir bestimmt wieder einiges abschauen 😊

            Gruß

            Negalein 1 Reply Last reply Reply Quote 0
            • Negalein
              Negalein Global Moderator @Conquest last edited by

              @Conquest sagte in Vorstellung meiner VIS-Oberfläche:

              Sehr schöne VIS. Würdest du einen Export bereitstellen? Kann ich mir bestimmt wieder einiges abschauen

              Danke

              Willst du alles oder nur bestimmte Seiten?

              C 1 Reply Last reply Reply Quote 0
              • C
                Conquest @Negalein last edited by

                @Negalein sagte in Vorstellung meiner VIS-Oberfläche:

                @Conquest sagte in Vorstellung meiner VIS-Oberfläche:

                Sehr schöne VIS. Würdest du einen Export bereitstellen? Kann ich mir bestimmt wieder einiges abschauen

                Danke

                Willst du alles oder nur bestimmte Seiten?

                Wenn der Export funktioniert würde ich alles nehmen 👍
                Danke.

                S Negalein 2 Replies Last reply Reply Quote 0
                • S
                  saeft_2003 Most Active @Conquest last edited by

                  @Conquest sagte in Vorstellung meiner VIS-Oberfläche:

                  @Negalein sagte in Vorstellung meiner VIS-Oberfläche:

                  @Conquest sagte in Vorstellung meiner VIS-Oberfläche:

                  Sehr schöne VIS. Würdest du einen Export bereitstellen? Kann ich mir bestimmt wieder einiges abschauen

                  Danke

                  Willst du alles oder nur bestimmte Seiten?

                  Wenn der Export funktioniert würde ich alles nehmen 👍
                  Danke.

                  Würde mich interessieren ob bei dir der export von deiner ganzen VIS geht? Weil wenn ich das in verschiedenen Browser anklicke passiert erstmal nichts und kurz danach crashen alle Adapter...

                  https://forum.iobroker.net/topic/30404/projektexport-funktioniert-nicht-instanzen-crashen

                  1 Reply Last reply Reply Quote 0
                  • Negalein
                    Negalein Global Moderator @Conquest last edited by

                    @Conquest sagte in Vorstellung meiner VIS-Oberfläche:

                    Wenn der Export funktioniert würde ich alles nehmen

                    gerade versucht.
                    Funktioniert leider nicht. weder normal, noch anonymisiert.

                    @saeft_2003 sagte in Vorstellung meiner VIS-Oberfläche:

                    Weil wenn ich das in verschiedenen Browser anklicke passiert erstmal nichts und kurz danach crashen alle Adapter...

                    Adapter crashen bei mir nicht. Aber Export funktioniert nicht. Egal welcher Browser.

                    C 1 Reply Last reply Reply Quote 0
                    • C
                      Conquest @Negalein last edited by

                      @Negalein
                      Firefox hat bis jetzt eigentlich immer funktioniert. Dauert nur ewig bis der Download startet.
                      Schade.

                      Negalein 1 Reply Last reply Reply Quote 0
                      • Negalein
                        Negalein Global Moderator @Conquest last edited by

                        @Conquest sagte in Vorstellung meiner VIS-Oberfläche:

                        Firefox hat bis jetzt eigentlich immer funktioniert. Dauert nur ewig bis der Download startet.

                        Ich versuchs jetzt mal auf einer anderen Maschine.
                        Wenns wieder nicht klappt, stell ich die Exporte der Views rein.

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

                          @Conquest

                          Ich hab im 1. Beitrag einiges ergänzt.
                          Probier mal bitte aus

                          C 1 Reply Last reply Reply Quote 0
                          • C
                            Conquest @Negalein last edited by

                            @Negalein sagte in Vorstellung meiner VIS-Oberfläche:

                            @Conquest

                            Ich hab im 1. Beitrag einiges ergänzt.
                            Probier mal bitte aus

                            Super danke.
                            Import hat funktioniert.

                            Negalein 1 Reply Last reply Reply Quote 0
                            • Negalein
                              Negalein Global Moderator @Conquest last edited by

                              @Conquest sagte in Vorstellung meiner VIS-Oberfläche:

                              Import hat funktioniert.

                              Perfekt

                              1 Reply Last reply Reply Quote 0
                              • W
                                wasi last edited by

                                @Negalein
                                Sehr schöne Vis. Ein dickes Lob!
                                Könntest Du Deine googleChartWeatherGraph.html noch einstellen bitte.
                                Die wurde beim Projektexport nicht mitgenommen, da sie wohl in vis.0/ liegt.
                                Danke!

                                Negalein 1 Reply Last reply Reply Quote 0
                                • Negalein
                                  Negalein Global Moderator @wasi last edited by Negalein

                                  @wasi sagte in Vorstellung meiner VIS-Oberfläche:

                                  Sehr schöne Vis. Ein dickes Lob!

                                  Danke

                                  Könntest Du Deine googleChartWeatherGraph.html noch einstellen bitte.
                                  Die wurde beim Projektexport nicht mitgenommen, da sie wohl in vis.0/ liegt.

                                  Da benötigst du das Script.
                                  ist im Ordner Wetter

                                  Oder nimms gleich von hier

                                  /*******************************************************************************
                                  * Script, um mittels Google Charts einen Wetter-Graph anzuzeigen
                                  * ----------------------------------------------------
                                  * Change Log:
                                  *  0.1 Mic - Initial Release
                                  * ----------------------------------------------------
                                  * Autor: Mic (ioBroker-Forum) / Mic-M (Github)
                                  * Quelle: https://github.com/Mic-M/iobroker.google-charts-example/
                                  * Support: https://forum.iobroker.net/topic/22779/vorlage-google-charts-beispiel
                                  ******************************************************************************/
                                  
                                  
                                  /*******************************************************************************
                                  * Konfiguration
                                  ******************************************************************************/
                                  
                                  // Der Pfad der HTML-Datei, einfach entsprechend anpassen.
                                  // In VIS dann etwa folgenden Pfad im iFrame-Widget einfügen: '/vis.0/M3/googleChartWeatherGraph.html', 
                                  // also nur den hinteren Abschnitt ab '/vis.....'
                                  const FILE_PATH = '/opt/iobroker/iobroker-data/files/vis.0/googleChartWeatherGraph.html';
                                  
                                  // Schedule
                                  const M_SCHEDULE = '5 1 * * *'; // Um 1:05 Uhr jeden Tag
                                  
                                  
                                  /*******************************************************************************
                                  * Executed on every script start.
                                  *******************************************************************************/
                                  let mSchedule;
                                  main();
                                  function main() {
                                      
                                      // Write the file initially on script start
                                      writeWeatherHtml();
                                  
                                      // Update file per schedule
                                      clearSchedule(mSchedule);
                                      mSchedule = schedule(M_SCHEDULE, writeWeatherHtml);
                                  
                                  }
                                  
                                  function writeWeatherHtml() {
                                      // Requiring fs module in which writeFile function is defined. 
                                      const fs = require('fs');
                                      // Write data in 'Output.txt' . 
                                      fs.writeFile(FILE_PATH, buildHTML(), (err) => { 
                                          if (err) throw err; // In case of a error throw err. 
                                      }) 
                                  }
                                  
                                  function buildHTML() {
                                      let html = '';
                                      html += '<html>\n';
                                      html += '<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>\n';
                                      html += '<script type="text/javascript">\n';
                                      html += "google.charts.load('current', {'packages':['corechart']});\n";
                                      html += "google.charts.setOnLoadCallback(drawChart);\n";
                                      html += "function drawChart() {"; + "\n";
                                  
                                      html += "var data = new google.visualization.DataTable();\n";
                                      html += "data.addColumn('string', 'Temperature');\n";
                                      html += "data.addColumn('number', 'Minimum');\n";
                                      html += "data.addColumn({type: 'number', role: 'annotation'});\n";
                                      html += "data.addColumn('number', 'Maximum');\n";
                                      html += "data.addColumn({type: 'number', role: 'annotation'});\n";
                                      for (let i = 1; i <= 7; i++) {
                                          let day = (i === 1) ? 'Heute' : getState('daswetter.0.NextDays.Location_1.Day_' + i + '.Tag_value').val.substr(0, 2);
                                          let tHigh = getState('daswetter.0.NextDays.Location_1.Day_' + i + '.Maximale_Temperatur_value').val;
                                          let tLow  = getState('daswetter.0.NextDays.Location_1.Day_' + i + '.Minimale_Temperatur_value').val;
                                          html += "    data.addRow(['" + day + "', " + tLow + ", " + tLow + ", " + tHigh + ", " + tHigh + "]);\n";
                                      }
                                  // See: https://developers.google.com/chart/interactive/docs/gallery/linechart#configuration-options
                                      html += "var options = {\n";
                                      html += "    curveType: 'function', backgroundColor: 'transparent', pointSize: 4,\n";
                                      html += "    hAxis: {textStyle:{color:'white'}},\n";
                                      html += "    vAxis: { textPosition: 'none', textStyle:{color:'red'},\n";
                                      html += "    baselineColor:'transparent', gridlines:{count:0} }, legend: { position: 'none' },\n";
                                      html += "    annotations: { stem: { length: 5, color: 'transparent' }, textStyle: {fontSize: 10, alwaysOutside: true, bold: false} }\n";
                                      html += "};\n";
                                      html += "var chart = new google.visualization.LineChart(document.getElementById('mychart'));\n";
                                      html += "chart.draw(data, options);\n";
                                      html += "}\n";
                                      html += "</script>\n";
                                      html += '<div id="mychart" style="width: 420px; height: 210px;"></div>\n';
                                      html += '</html>\n';
                                      return html;
                                  }
                                  
                                  1 Reply Last reply Reply Quote 0
                                  • W
                                    wasi last edited by

                                    Das Script habe ich gefunden, läuft aber nicht.
                                    Das fehlt:

                                    const FILE_PATH = '/opt/iobroker/iobroker-data/files/vis.0/googleChartWeatherGraph.html';
                                    
                                    Negalein 1 Reply Last reply Reply Quote 0
                                    • Negalein
                                      Negalein Global Moderator @wasi last edited by

                                      @wasi sagte in Vorstellung meiner VIS-Oberfläche:

                                      Das fehlt:

                                      die Datei erstellt eigentlich das Script.
                                      Aber probier mal aus und lad diese hoch.
                                      googleChartWeatherGraph.html

                                      Und hier der Thread dazu.

                                      1 Reply Last reply Reply Quote 0
                                      • W
                                        wasi last edited by

                                        Ich glaube ich hab den Fehler bei mir gefunden.
                                        Der Debugger: Error im Script Zeile 67
                                        Da steht ....daswetter....
                                        Adapter hatte ich installiert, jedoch hab ich die Pfade zu den XML Dateien noch gar nicht abgespeichert. 🙄

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

                                          Hallo,
                                          zuerst einmal ganz tolle Arbeit! Sieht Klasse aus. Ich habe dein Wetter-View genommen. Jetzt habe ich das Problem, dass bei mir die Grafik nicht richtig angezeigt wird (s. Bild)
                                          Bild1.png

                                          Was muss ich denn dort ändern? Wenn ich dein view anzeigen lasse, geht es wunderbar.
                                          Dann noch eine Frage zu den Skripten? Welche Skripte brauche ich denn zwangsläufig? Ich habe festgestellt, dass ich die Skripte nicht benötige und trotzdem werden bei mir alle Daten richtig dargestellt. So etwas wie Alexa habe ich nicht.
                                          Vielen Dank im Voraus und noch einmal tolle Arbeit und danke für das Bereitstellen!

                                          Negalein 1 Reply Last reply Reply Quote 0
                                          • Negalein
                                            Negalein Global Moderator @jwerlsdf last edited by

                                            @jwerlsdf sagte in Vorstellung meiner VIS-Oberfläche:

                                            zuerst einmal ganz tolle Arbeit! Sieht Klasse aus. Ich habe dein Wetter-View genommen.

                                            Danke dir!

                                            Jetzt habe ich das Problem, dass bei mir die Grafik nicht richtig angezeigt wird (s. Bild)

                                            Du musst die CSS übernehmen/kopieren.

                                            Edit vis (7).png Edit vis (8).png

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            561
                                            Online

                                            31.9k
                                            Users

                                            80.1k
                                            Topics

                                            1.3m
                                            Posts

                                            14
                                            51
                                            8357
                                            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