Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨

[RedRobin132]

Hallo!
Ich habe in meinem ioBroker Daten von einem Ultraschallsensor. Diese möchte ich auf per Browser (als Verlauf) anzeigen. Das habe ich per vis und flot realisieren können:

Mein Problem ist jetzt, dass nicht nur ich, sondern auch andere auf diese Webseite zugreifen können sollen. Da ich den Port der vis nicht öffnen möchte, habe ich mir gedacht, dass ich das ganze per apache server und iframe einbinden kann, habe aber nicht bedacht, dass der iFrame client-seitig läuft und daher nicht auf die vis zugreifen kann.
Jetzt ist meine Frage, hat jemand von euch eine Idee, wie ich es schaffe diese Datendarstellung online zu realisieren und auch die Eingaben des Nutzers an die vis weiter zu geben (sozusagen ein Server-seitiger iframe)?

Vielen Dank im Vorraus
Robin

[Samson71]

@redrobin132
Da Du gem. IP aus DE bist:
Falsche Kategorie? Post in Englisch im deutschen Bereich? Soll das verschoben werden?

[RedRobin132]

@samson71 oh, ups, ich hatte übersehen, dass ich im deutschen Bereich bin, ich lösche es nochmal und schreibe es auf deutsch neu

[RedRobin132]

@samson71 Habe es übersetzt

[MartinP]

@redrobin132 Um was für einen Personenkreis geht es? Familie?

Kann man ggfs von Flot eine pure SVG oder PNG Grafik basteln lassen, und die statisch in eine Webseite einbinden?

Nach diesem Vorbild:

https://stackoverflow.com/questions/15616925/save-flot-graph-as-image

[RedRobin132]

@martinp Personenkreis sind vorraussichtlich erstmal nur Freunde, also alle persönlich bekannt.
Mit der statischen Grafik wäre fürs erste mal eine Lösung, aber es wäre gut, wenn man den Zeitraum von der Webseite aus dynamisch anpassen könnte und das geht damit glaube ich nicht, oder?

[MartinP]

@redrobin132 Könnte man ggfs zumindest Schrittweise machen über Select Buttons und statisch vorbereiteter Grafiken für verschiedene Zeitspannen (Letzte drei Monate, Letzter Woche, Letzte drei Tage usw)

Je nachdem, welcher Button geklickt wird, werden verschiedene Grafiken eingeblendet ...

Wenn Du eine Fritzbox hast, könntest Du für die Freunde (So es denn vertrauenswürdige, gute Freunde sind) auch einem Wireguard VPN - Zugang einrichten .....

Oder Zugang zu VIS über einen NGINX Reverse Proxy mit vorgeschalteter Anmelde-Seite ... Ist auch ein Projekt, was ich gerne machen würde, aber nicht dazu komme ;-)

[RedRobin132]

@martinp Oh, danke! Das ist gar keine schlechte Idee, mit den mehreren vorbereiteten Seiten. Ich glaube, das werde ich mal umsetzen.
Mit dem reverse Proxy, muss ich mich erstmal reinlesen, dann probiere ich das eventuell zu einem späteren Zeitpunkt nochmal aus.
Vielen Dank für die Hilfe!

[BananaJoe]

Da ich meine Solardaten auch gerne von Unterwegs anschauen wollte, aber keine Lust hatte deshalb meinen ioBroker nach außen zu öffnen habe ich das mit Grafana gemacht.
Ja, wenn man da nach Anleitungen schaut kommt immer InfluxDB + Grafana. Ich hab das nun mal alles im SQL Adapter und keine Lust das nur deswegen umzustellen. SQL und Grafana war/ist dann auch mir zu kompliziert, aber es geht auch per SimpleAPI (aus ioBroker, Grafana holt sich die Werte per http- Aufruf als JSON, nennt sich dort SimpleJSON).

Auf dem Handy nutze ich die "Viewer4Grafana" App, mein Grafana Server ist über eine Subdomäne öffentlich - in Deutschland - erreichbar.

Aber - Grafana kann auch Dashboards (also eine Sammlung von Werten, Kurven usw.) für das einbetten in Webseiten bereitstellen:
https://grafana.com/blog/2023/10/10/how-to-embed-grafana-dashboards-into-web-applications/

Da gibt es sogar einen "public" Abschnitt.

Also, ich habe nur Grafana installiert, dort als Quelle den SimpleJSON eingerichtet und mir so meine Diagramme und Werte zusammengebaut:

Konfiguration der SimpleJSON Datenquelle:

Eventuell ist das ja ein Weg für dich dann mit dem Public-Link

[RedRobin132]

@bananajoe Vielen Dank, werde ich mir auch mal anschauen. Du sagst, das funktioniert auch theoretisch mit SQL? Das wäre für mich ziemlich praktisch, da ich die Daten sowieso schon in eine MariaDB Datenbank speichere, dann könnte ich das auch mal darüber versuchen.

[BananaJoe]

@redrobin132 sagte in Show vis online:

Du sagst, das funktioniert auch theoretisch mit SQL?

Nicht nur theoretisch. Ich habe einen Abend dran rumprobiert. Wenn man SQL als Quelle nimmt (man stellt die Datenbank ein die der SQL-Adapter nimmt) hat man aber keine bequeme, direkte Auswahl der Datenpunkte. Wenn du dir die Tabellen anschaust gibt (das ist jetzt auswendig aus dem Kopf) eine Tabelle datapoints wo man sehen kann welcher Datenpunkt welchen Indexeintrag hat und welcher Typ das ist. Damit kann man dann aus den anderen Tabellen für Zahlen, Text usw den Wert holen:

MariaDB [iobroker]> show tables;
+--------------------+
| Tables_in_iobroker |
+--------------------+
| datapoints         |
| sources            |
| ts_bool            |
| ts_counter         |
| ts_number          |
| ts_string          |
+--------------------+
6 rows in set (0,000 sec)

Weshalb man da eine Abfrage bauen muss um das zusammenzubauen.
Beim SimpleJSON kann man den Datenpunkt einfach reinkopieren bzw. durch Texteingabe suchen.

Wenn du das mit SQL leichter hinbekommst (mein Versuch ist nun auch schon fast 2 Jahre her), bitte gerne eine Anleitung hier,

[RedRobin132]

@bananajoe So, ich habe mich jetzt heute dran gesetzt. Eine MariaDB hatte ich schon eingerichtet (nicht über ioBroker), wo alle benötigten Daten per NodeRed gespeichert werden. Über Grafana PDC bekomme ich Zugriff auf mein Netzwerk, ohne irgendwelche Ports öffnen zu müssen. Die Datenvisualisierung funktioniert so ohne größere Probleme!
Vielen Dank!

[BananaJoe]

@redrobin132 du nutzt aber keine Daten des SQL-Adapters? Also wo er dann Daten der Datenpunkte aufzeichnet? Sondern du speicherst nativ per NodeRed?

[RedRobin132]

@bananajoe Jup, ich habe eine separate MariaDB laufen, die per Node-Red beschrieben wird

[BananaJoe]

@redrobin132 naja, dann ist das in Grafana ja auch kein Problem