Grafik einbinden

[Hossi81]

Hallo,

für meine Hochwasserprognose benötige ich die Grafiken der Zuflüsse der Saale. Früher basierten diese auf .png Dateien. Neuerdings liegen die Grafiken, wie folg vor:

https://hochwasservorhersage.sachsen-anhalt.de/fileadmin/Bibliothek/Politik_und_Verwaltung/MLU/HVZ/KISTERS/webapp/static-wiski-web-public/index.html#570500

Wie kann ich solche Bilder, mit wechselnden Adressen, sinnvoll in meine Seite einbinden?

Danke.

[TheWeather]

Hallo Hossi81,

ich habe noch nicht verstanden, ob Du die Bilder vollautomatisch oder nur manuell einbinden möchtes (mit wechselnden Adressen, ich nehme an, wechselnde Stationen).

Manuell ist recht einfach: Du hast ja den Link angegeben, mit dem Du Direkt auf das Diagramm zur entsprechenden Station gelangst (Woche, Monat oder Jahr). Durch Klicken auf das Bild mit der rechten Mousetaste (z.B. in Firefox) kannst Du die Grafik direkt als .png speichern. Der Name lautet ja immer index.png, so dass Du nur das Präfix entsprechend ändern musst, damit es auch unter dem entsprechenden Stationnamen abgelegt wird. Die anderen Stationen unterscheiden sich ja nur durch den Aufruf .../index.html#xxxxxx (in Deinem Beispiel .../index.html#570500) beim Aufruf des entsprechenden Diagramms.

Die Download-Daten werden in .xlsx (neues Excelformat seit Office 2007(?)) zurückgeliefert. Da gibt's die Möglichkeit, in Excel (oder günstigen oder freien Programmen) .xlsx zu laden und als .csv wieder abzuspeichern. Da .csv textbasiert ist (wie auch bei WsWin verwendet), kommt man dann recht einfach an einzelne Datenzeilen zur Auswertung (Zeitstempel, Einzelwerte) heran, um z.B. auch eigene Tabellen zu füllen und auszuwerten. Das dürfte auch mit PHP oder HTML (ist aber nicht mein Metier) einfach zu erfüllen sein.

Falls Du das Ganze automatisiert über ein Script oder auch Programmierung in PHP/HTML ablaufen lassen wolltest, fehlen mir einfach die Kenntnisse, hier weiterhelfen zu können.

Aber es ist ja vielleicht schon mal ein Ansatz ...

Gruß Hans

[Hossi81]

Hallo,

danke für deine Antwort. Das Bild an sich zu speichern geht ja, doch es als Bilddatei in meine Seite einzubauen, geht nicht, weil das irgendwie keine richtige Bilddatei ist.

Vielleicht weiß ja jemand Rat, wie man nur die reine Grafik als Bild einbinden kann.

Danke.

[TheWeather]

Hallo,

ich kann diese .png-Datei mit all meinen Tools öffnen, sollte also vom Format her schon eine "echte" .png sein. Falls Du nur das reine Diagramm brauchst, kannst Du's auch pixelgenau ausschneiden und dann als .png, .jpg oder andere Formate speichern. Ich verwende seit Jahren das freie Tool "TNT Screen Capture" von ec-software. Das ist zwar nur in englisch, aber selbsterklärend und leicht in der Anwendung ist und es hat einen breiten Funktionsumfang.

Gruß Hans

[Hossi81]

Ja, aber ich kann das Bild nicht aktuell halten, da dieses Bild statisch und unverändert bleibt. Möchte ich aber immer den aktuellen Pegelstand abbilden, muss ich die ganze Seite einbinden, was dann wieder nicht responsive!

[joergeli]

Hallo Hossi,

Wenn Du das Bild speichern kannst, es aber in Deiner Seite nicht aktualisiert wird, wird es wahrscheinlich vom Browser "gecached", d.h. beim nächsten Aufruf wird das alte Bild aus dem Cache geholt und angezeigt.

Bei mir hänge ich in solchen Fällen ( Bildname bleibt gleich, Bildinhalt àndert sich) einen PHP-Zeitstempel an.
Dadurch wird dem Browser quasi ein neues Bild vorgegaukelt.
Für den Browser sieht der Bildname dann z.B. so aus:
http://joergeli.de/aktuell.gif?1517576437
Da sich der Zeitstempel bei jedem Aufruf des Bildes ändert, "denkt" der Browser, es handelt sich um ein anderes, als das im Cache und ist somit gezwungen es neu zu laden.

Der zugehörige HTML/PHP-Code sieht so z.B. aus:

Code Auswählen Erweitern

<img src="xyz.png?

<?php echo mktime();?>

"


Gruß
Jörg

[Hossi81]

Danke, dass werde ich probieren. Jedoch ist die Bildadresse nicht normal, sondern besteht aus tausenden von Zeichen.

Guckt mal beim Rechsklick auf dasBild in die Eigenschaften.

https://hochwasservorhersage.sachsen-anhalt.de/fileadmin/Bibliothek/Politik_und_Verwaltung/MLU/HVZ/KISTERS/webapp/static-wiski-web-public/index.html#570500

[joergeli]

Hallo Hossi,

..... Jedoch ist die Bildadresse nicht normal, sondern besteht aus tausenden von Zeichen....

Stimmt, so wie ich die Bild-Adresse interpretiere ( data:img/png;base64,xxxxxxxxxxxxxxxxxx......) handelt es sich hier wohl um den Inhalt des png-Bildes, der "irgendwie" aus einer Datenbank generiert wird.

Ich glaube nicht, daß man das automatisiert downloaden, bzw. einbinden kann.
Evtl. hat aber jemand anderes noch eine Idee?

Sorry
Jörg

[TheWeather]

Danke, dass werde ich probieren. Jedoch ist die Bildadresse nicht normal, sondern besteht aus tausenden von Zeichen.

Ja, schon, aber nachdem sie als .png gespeichert wurde, ist es ein .png-Bild. Was die Datei-Info beschreibt, ist das ungespeicherte Bild, welches wahrscheinlich eher eine interne Strukturbeschreibung darstellt. Ich kann die .png nach dem Speichern auch mit beliebigen Bildbearbeitungsprogrammen (z.B. paint, tnt screen capture, Windows Bild- und Faxanzeige, etc) problemlos bearbeiten. Dann steht auch eine .png-Kennung im Header und nicht mehr data:img/png:base64, xxxxxxxxxxxxxxx.....

Ansonsten gibt's ja vielleicht auch einen Tip des Website-Betreibers, wie man (edit:) automatisiert direkt an das Diagramm alleine kommt (edit:) und eventuell einen (c)-Vermerk des Anbieters im Textformat darunter schreibt.

Es bleibt immer noch der umständlichere Umweg, den Daten-Download in Excel zu öffnen, dort die grafische Darstellung aus den Daten selbst zu erzeugen oder aus Excel eine .csv zu erzeugen, die man eventuell mit anderen Tools ebenfalls in ein Diagramm abbilden kann.

Gruß Hans

[Holli]

Base64 ist einfach eine Methode, um Binärdaten in ASCII übertragen oder speichern zu können. https://de.wikipedia.org/wiki/Base64