6.3 – Grafana – ioBroker VIS Integration

In diesem Artikel zeige ich Dir, wie Du ein in Grafana erstelltes Dashboard oder Panel in ioBroker VIS integrieren kannst.

Im 6. Artikel der Grafana Artikelreihe haben wir bereits die Grafana Konfiguration für den Zugriff und das Einbetten von Dashboards in Fremdsysteme konfiguriert. Im Artikel 6.1 haben wir dann einen Link generiert, welchen wir nun in ioBroker VIS über das iFrame Widget darstellen werden.

Im ersten Schritt öffnen wir nun ioBroker VIS und wählen eine View aus, auf der wir das Grafana Dashboard einfügen möchten. Wenn Du die View geöffnet hast, kannst Du jetzt das iFrame 8 Widget über die Widget-Leiste auf der linken Bildschirmseite einfügen und die Größe des Widgets direkt anpassen.

In den Eigenschaften des Widgets können wir jetzt im Bereich Allgemein in das Eingabefeld Quelle den vorher generierten Link aus Grafana einfügen.

Wenn wir jetzt die View öffnen, sehen wir hier das Grafana Dashboard.

Wir haben jetzt das komplette Dashboard in unsere View integriert. Das Grafana Dashboard passt sich dabei an die Größe des Frame-Controls an und verkleinert bzw. verändert die Darstellung automatisch.

Was mich aber aktuell noch stört ist die Tatsache, dass im iFrame Widget auch die komplette Menüleiste von Grafana eingeblendet wird. Ein Anwender könnte so das Dashboard wechseln und andere Daten einsehen. Für dieses Problem gibt es eine separate Option am Link des Dashboards.

Füge dazu einfach hinter den Link noch folgenden Parameter hinzu:
&kiosk

Damit öffnet sich Grafana im sogenannten Kiosk-Modus. In diesem Modus wird nur das Dashboard ohne weitere Menüleisten dargestellt. Der einzige Nachteil ist jetzt die Tatsache, dass im Kiosk-Modus die Zeit-Auswahl nicht mehr eingeblendet wird. Da ich aber in der Regel mit relativen Zeitangaben arbeite, stört mich das hier nicht weiter.

Ich hoffe Dir gefällt der Artikel. Über Kommentare, Anregungen oder Ideen freue ich mich wie immer 🙂

Matthias Korte

Hauptberuflich Software-Entwickler und seit einigen Jahren Smart-Home Fan. Angefangen hat alles mit einem RaspberryMatic und einer schaltbaren Steckdose. Mittlerweile habe ich einige Steckdosen, Sensoren, und Thermostate sowie ioBroker zur Visualisierung im Einsatz.

3 Gedanken zu „6.3 – Grafana – ioBroker VIS Integration

  • 13. November 2020 um 20:07
    Permalink

    Hallo habe ein Dashboard in die Iobroker VIS eingefügt bekommen. Nur aktualisiert sich das Dashboard nicht egal wo ich es anzeigen lasse, ob auf dem Tablet im Fully Browser oder auf dem PC im Edge Browser. Woran kann das liegen?

    Antwort
    • 14. November 2020 um 12:12
      Permalink

      Moin Sascha,

      hast Du die automatische Aktualisierung des Dashboards aktiviert?

      LG Matthias

      Antwort
  • 24. November 2020 um 12:26
    Permalink

    Hallo Matthias,

    ein wirklich tolles Tutorial hast du da zusammengestellt. Vielen Dank!
    Ich hänge inhaltlich an einem Punkt, den du in deinen Ausführungen auch als störend herausstellst.
    Die Tatsache, dass im iFrame Widget auch die komplette Menüleiste von Grafana eingeblendet wird. Deine Lösung mit dem Kiosk-Modus bringt mich leider nur bedingt weiter.

    Ich würde gerne meinen PV-Ertrag (in einer InfluxDB) loggen und mit Grafana in vis darstellen. Das läuft auch soweit – die Systembasis ist ein Raspberry pi4 mit ioBroker.
    Typischerweise möchte ich dabei die Vortage, die Vorwochen, die Vormonate, das Vorjahr etc. ansteuerbar darstellen- um genau diesen Zeitraum zu betrachten.

    Über die Einblendung des Zeitraums ist das via Grafana-Menüleiste ja grundlegend möglich – wenn auch nicht optimal…(Es sind zu viele Auswahloptionen sichtbar – Die Navigation ist bescheiden).

    Alternativ muss ich für alle gewünschten iFrames in vis eine eigene Seite zusammenstellen, um dort den Dashboard-Link bei der iFrame Integration zu verändern. (now-1d/d);(now-2d/d) usw. Hierhin muss ich dann aktuell statisch verlinken.

    Kennst du für mein Vorhaben mit 4 Buttons (Tag, Woche, Monat, Jahr) und ggf. einem Kalender eine schönere/einfachere Darstellungsvariante, mit einer dynamischen (kalenderbasierten) Steuerungsoption für das Grafana-Dashboard?

    Antwort

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.