HTMLBox und auszuführendes HTML Script

Hallo,

Ich habe mich schon ewig nicht mehr um Symcon gekümmert und somit lief die Ganze Umgebung bei mir noch auf Version 3.4.
Da ich jetzt etwas mehr Zeit habe mich um solche Dinge zu kümmern, habe ich die Neuinstallation auf einem Raspberry und Version 5.3 gewagt.
Hammer was sich da getan hat,

Nun möchte ich wieder ein paar Dinge einrichten die meiner Meinung nach fehlen.
Leider fühle ich mich damit als absoluter Neuling und muss mich selbst an die kleinsten dinge wieder herantasten.
Ich möchte die Temperatur meiner Räume im Haus als Gauge darstellen und mir diese über die Google Charts reinholen.
Dazu habe ich ein Beispiel von der Google Seite genommen, dieses im Verzeichnis „/var/lib/symcon/scripts“ abgespeichert.
Danach eine Variable mit HTMLBox erstellt mit dem Wert des Strings
<iframe src="/var/lib/symcon/scripts/gauge.html" width=„300“ height=„180“ frameborder=„no“ scrolling=„no“></iframe>
Es erscheint eine HTML Box in der angegebenen Größe mit dem Text „File not found

Hier das Script, dass, wenn ich es im Browser ausführe, einwandfrei funktioniert.


<html>
  <head>
   <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
   <script type="text/javascript">
      google.charts.load('current', {'packages':['gauge']});
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {

        var data = google.visualization.arrayToDataTable([
          ['Label', 'Value'],
          ['Büro', 20],
          ['Wohnen', 20],
          ['Tim', 20]
        ]);

        var options = {
          width: 600, height: 180,
          redFrom: 30, redTo: 40,
          greenFrom: 10, greenTo: 30,
          yellowFrom: 0, yellowTo: 10,
          yellowColor: '58acfa',
          minorTicks: 5,
          min: 0,
          max: 40
        };

        var chart = new google.visualization.Gauge(document.getElementById('chart_div'));

        chart.draw(data, options);

        setInterval(function() {
          data.setValue(0, 1, 22);
          chart.draw(data, options);
        }, 6000);
        setInterval(function() {
          data.setValue(1, 1, 0 + Math.round(40 * Math.random()));
          chart.draw(data, options);
        }, 6000);
        setInterval(function() {
          data.setValue(2, 1, 0 + Math.round(40 * Math.random()));
          chart.draw(data, options);
        }, 6000);
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 600px; height: 180px;"></div>
  </body>
</html>

Kann mir jemand bitte dazu einen Tipp geben?
Danke im Voraus.

Gruß
Michael

Der Iframe-Inhalt wird vom Browser gezogen. Möglichkeit A: du kopierst per PHP den Inhalt dieser Datei in die HTML Box (ggf. inkl. passendem Container herum). Möglichkeit B: du packst die Datei in das Webfront Verzeichnis. /var/lib/symcon/webfront/user/ und nennst den Iframe dann entsprechend /user/gauge.html

Hallo Tobias,

Danke für den Tipp.
Ich hatte nicht daran gedacht, dass es unter dem Webfront Ordner noch einen „user“ Ordner gibt.
Danke schön.

Hast du noch einen Tipp für mich wie ich einen Wert , den ich in PHP mit GetValueFloat(x) hole in Javascript bekomme?

Warum legst Du das HTML nicht als PHP Datei im Users Ordner an und erzeugst damit dann das HTML. Dann kannst Du auch Variablen abfragen und die Werte direkt im JS verwenden!

Gruß Heiko