Markdown Inhalte im Grafana einbetten

Benutzung / Usage Datenanzeige / Data display
,
#1

Über

Bei Panel für Webcam-Bild, das regelmäßig aktualisiert wird haben wir geschaut, wie sich Bilder von anderswo optimal ins Grafana einbetten lassen. Hier schauen wir, wie das gleiche gut mit Markdown Inhalten klappen könnte.

Use-case

Bei DWD-Prognose Bienenflug haben wir eine API vorbereitet, die Bienenflugprognosedaten vom DWD in die JSON und Markdown Formate übersetzt.

Prognose des Bienenfluges in Potsdam

Datum morgens mittags abends
Mi 24.05. gering mittel hoch
Do 25.05. hoch sehr hoch sehr hoch
Fr 26.05. mittel hoch hoch
#2

Hi.

Gibt es eigentlich für die HTTP API, die der Eumel bereitstellt, schon irgendeine Art von Grafana Visualisateur?

– https://apicast.hiveeyes.org/beeflight/forecast/germany/brandenburg/potsdam?translate=false&format=json
– https://apicast.hiveeyes.org/beeflight/forecast/germany/brandenburg/potsdam?format=json-machine

Viele Grüße,
Andreas.

P.S.: Wenn irgendein Grafana Plugin Markdown rendern könnte, dann wären wir mit diesem Endpunkt hier [1] schon nahe am Ziel, nicht?

Prognose des Bienenfluges in Potsdam

Datum morgens mittags abends
Mi 24.05. gering mittel hoch
Do 25.05. hoch sehr hoch sehr hoch
Fr 26.05. mittel hoch hoch

  1. https://apicast.hiveeyes.org/beeflight/forecast/germany/brandenburg/potsdam?translate=false&format=table-markdown ↩︎

DWD-Prognose Bienenflug
#3

Das neulich bei Panel für Webcam-Bild, das regelmäßig aktualisiert wird verwendete, bereits eingebaute “Text” Panel kann Markdown rendern, siehe Dashboard HTML and Markdown embedding. Derzeit ist es aber leider nur statisch, es bräuchte entweder eine dynamische Variante, oder eine andere Komponente, die das im Intervall aktualisiert.

image

1 Like
#4

Wir haben auf swarm leider immer noch Grafana 6.7.6. Es wird Zeit.

– ! Grafana Update auf "swarm.hiveeyes.org"!
– Giving the backend software infrastructure some love (2022)

1 Like
#5

Habe es bei dynamic-text-testing mit dem GitHub - VolkovLabs/volkovlabs-dynamictext-panel: A dynamic, data-driven text for @grafana. versucht, konnte aber nicht herausfinden, dass man damit irgendwie Markdown von Ferne laden und darstellen könnte. Das was man im Beispiel sieht, ist auch statisch.

Wahrscheinlich müssen wir doch die JSON API anzapfen, mit Introduction | JSON API for Grafana, und dann selbst rendern.

#6

Das Base64 Image/Video/Audio/PDF Panel ist auch nett, aber leider ebenfalls knapp dran vorbei.

– Base64 Image/Video/Audio/PDF Panel 3.5.0 | Volkov Labs
– GitHub - VolkovLabs/volkovlabs-image-panel: Base64 Image/Video/Audio/PDF Panel for @grafana.

#8

Lösung

Mit ein wenig mehr JavaScript Code klappt es nun tadellos. Wir haben den Markdown Renderer schließlich nicht umsonst in die Apicast API eingebaut ;]. [1]

image
– Siehe Beispiel-Dashboard HTML and Markdown embedding.

Rezept

Das Rezept gibt es bei [markdown-remote] Rendering Markdown fetched from a remote location, with interval-based refresh and cache busting by amotl · Pull Request #2 · panodata/grafana-snippets · GitHub, siehe auch README.

Backlog

  1. – GitHub - astanin/python-tabulate: Pretty-print tabular data in Python, a library and a command-line utility. Repository migrated from bitbucket.org/astanin/python-tabulate. FTW! ↩︎

1 Like
#9

sehr schön. ich als end-tester mit niedrigschwellenbedarf kann das auf anhieb anwenden.
dabei fällt mir auf: bei wahl der englischen übersetzung kommt ein lustiges sprachgemisch raus:

Beeflight forecast for Berlin-Tempelhof (1)

date morning noon evening
Do 25.05. strong sehr strong sehr strong
Fr 26.05. medium sehr strong strong
Sa 27.05. strong sehr strong sehr strong
2 Likes
#10

Wunderbar, so soll es sein.

Das ist uns gestern auch schon aufgefallen – danke.

– Translation for "very strong" (probability) is wrong · Issue #14 · hiveeyes/apicast · GitHub

#11

Mega gut, Leute! das gefällt mir ordentlich! Vielen Dank!

1 Like