Externe Einbindung "Waldbrandgefahrenindex" über Website-Element

1. offizieller Beitrag

    Hallo zusammen,

    bei uns in der Wehr kam der Wunsch auf, die aktuelle Waldbrandstufe anzeigen zu lassen. Da ich kein direktes Standbyelement dazu gefunden habe wollte ich dies über die Seite des DWD machen.

    Nun ist aber das Problem, dass die Website "falsch" angezeigt wird. "Falsch" bedeutet hierbei, dass nur die hälfte der Karte angezeigt wird, da man ein wenig herunter scrollen müsste. Da die Darstellung im Monitor aber anscheinend immer zurückgesetzt wird (nachdem das Website-Element durch lief) und man natürlich auch nicht jedes mal neu herunter scrollen kann, kommt mir die Frage auf, ob und wie ihr das macht.

    Für Lösungsvorschläge bin ich jeder Zeit offen.


    MkG

    Hallo,

    erstmal vielen Dank. So ungefähr habe ich mir das vorgestellt.

    Das einzige Problem was nun aufgetreten ist, ist dass das Bild dennoch zu klein ist. Man erkennt aus "der Ferne" heraus nicht all zu viel. Eine Möglichkeit, das Bild "größer" zu machen gibt es aber vermutlich nicht, oder?

    (Mit HTML kenne ich mich ein wenig aus, dass aber in das Standbyelement einzubauen überschreitet dann aber doch meine Fähigkeiten ^^ )

    Moin,

    versuch mal die angehängte txt am PC vom Alarmmonitor zu speichern und rufe dann den Speicherort als URL im Standbyelement auf (vorher die Dateiendung von .txt auf .html ändern - das Forum lässt kein HTML Anhang zu)

    Was macht die HTML: Hintergrund weiß, Karte zentriert und die Höhe auf 100% vom Fenster.

    HTML
    <html>
<body bgcolor=white>
<center><img src="https://www.dwd.de/DWD/warnungen/agrar/wbx/wbx_stationen.png" height="100%"></center>
</body>
</html>

    ich habe es zwar nicht für den Monitor gebaut, sondern für unsere Webseite aber ich denke, für den Monitor sollte es sich auch verwenden lassen.

    Hier wird die Waldbrandgefahrenstufe als Tacho dargestellt und was mir wichtig war, aus unserer Region. Denn was interessieren mich die Gebiete am anderen Ende von Deutschland 😅

    Da der DWD hier leider etwas doof programmiert hat, ist es nicht so ganz einfach den richtigen Datensatz zu bekommen, hier muss man einfach mal bisl Try and Error machen oder genau zählen können :D.

    Auf dieser Webseite: Wetter und Klima - Deutscher Wetterdienst - Zum Archiv "DWD Aktuell" - Waldbrandgefahrenindex muss unterhalb der Grafik auf die Schaltfläche Tabelle geklickt werden. Hier kann man sich dann seine Region aussuchen und muss dann den entsprechenden Link in den Code in Zeile 25 eintragen.

    In Zeile 20 muss man dann noch nach "aria-label=" das Bundesland angeben und beim Array dann noch die jeweilige Zeile mitgeben, sodass auch der eigene Ort verwendet wird.

    Wie gesagt, ist alles etwas umständlich aber funktioniert. Kann man dann für den Monitor ja evtl. noch ein wenig aufhübschen. Ich habe es mal Quick'n Dirty in den EM eingebunden.

    Ist dann evtl. eine Alternative zur gesamten karte Deutschlands. Man könnte diese z.B. auch noch daneben Abbilden, dann hat man beides.

    Ein Standbyelemt für Wald/Grasbrand wurde bei uns auch vermisst, aktuell ist nur die kleine Deutschlandkarte auf dem Monitor. Der Tacho ist eine tolle Idee!

    Die Deutschlandübersicht neben den Tacho wäre natürlich die Krönung, kann mir hier jemand Hilfestellung geben, wie man das anstellen muss? Habe mich bisher noch nie mit Programmieren oder HTML befasst.....

    Zitat von Butje

    Die Deutschlandübersicht neben den Tacho wäre natürlich die Krönung, kann mir hier jemand Hilfestellung geben, wie man das anstellen muss? Habe mich bisher noch nie mit Programmieren oder HTML befasst....

    Ja, das wäre auch für uns das Nonplusultra ^^

    Alles klar!

    Ich habe die Deutschlandkarte nun noch einmal daneben gesetzt. 😊

    EDIT:

    Da die Frage aufkam, wie man seine Region im Code einträgt, hier noch einmal eine kleine Ergänzung.

    Wenn man die Tabelle für sein Bundesland offen hat, dann muss man von oben anfangen zu Zählen. In diesem Beispiel nehme ich "Hof" Aus Bayern. Wie in dem sehr schön gezeichnetem Bild zu sehen, ist es hier A4. Darüber hinaus möchte ich den Wert für den 08.08. also immer für den heutigen Tag haben. Dieser ist in dem Bild mit B1 gekennzeichnet.

    In der Zeile 20 finden wir folgenden Code:

    var html = doc.querySelectorAll("[aria-label='Bayern'] tr")[30].querySelectorAll("td")[1].innerText

    Dort wo nun die rote 30 steht, muss jetzt die 4 von A4 eingetragen werden, da es die 4. Zeile von oben ist. Die grüne 1 kann stehen bleiben, da der heutigen Tag abgebildet werden soll. Wenn man hingegen den Morgigen abbilden will, dann wird hier eine 2 für die 2. Spalte reingeschrieben.

    Ich hoffe das wurde nun etwas deutlicher :)

    Zitat von John Sausage

    Super Ding! Danke.

    Ich habe nur das Problem, das bei der Anzeige die Skalierung nicht passt.

    [...]

    deine Auflösung scheint dann ggf. nicht 1920x1080 zu sein, denn auf dieser Auflösung hatte ich das ganze mit der heißen Nadel gestrickt gehabt.

    Du hast hier nun zwei Möglichkeiten:

    1. Du verkleinerst die Elemente im Code. Z.B. in Zeile 34. "height: 500" auf 400 setzen, dann verkleinert sich der Tacho entsprechend. In Zeile 51 kannst du innerhalb der geschweiften Klammern ebenfalls noch ein "height: 400px" einfügen oder 90%, dann wird auch die Deutschlandkarte verkleinert.
    2. Du passt das Fenster für die Standbyelemente an, um mehr Platz zu bekommen, indem du den Rahmen verkleinerst.

    EDIT:

    Ich habe noch einmal eine kleine Anpassung vorgenommen, sodass die Skalierung sich automatisch an den vorhandenen Platz anpasst. Dann sollte es weniger Probleme mit unterschiedlichen Monitorgrößen geben.

    Morgen,

    das mit der Randbreite, das war der entscheidende Punkt. Die größen der Elementen hatte ich vorher schon mal geändert.

    Jetzt passt es perfekt! Danke.

    Hab mir noch den Namen für meine Messtelle eingebaut .......

    Hi,

    vielen Dank für die Mühe.

    Ich habe die HTML entsprechend abgeändert und wenn ich sie über den Browser

    aufrufe, dann klappt es.

    Wenn ich den Pfad von der Datei auf den Desktop in ein Webseitenstandbyelement einfüge,

    kommt allerdings nur ein leeres Fenster ohne Inhalt.

    Muss der Pfad irgenwie besonders aufgebaut werden?

    Von wo du die Daten nimmst, spielt keine Rolle. Du musst halt nur die Quelle anpassen und dann den Code etwas, damit die richtige Zeile / Spalte genommen wird. Ich habe es mal kurz umgeschrieben.

    doc.querySelectorAll("tr")[1]

    Die rote 1 in Zeile 20 musst du dann durch die Zeilennummer deiner Region ersetzen. Also einfach von oben anfangen zu zählen.

    Die Karte wird weiterhin vom DWD geladen, da diese nicht selber erzeugt wird. Die Angabe im Tacho ist dann aber die von deiner Seite.