Bilder per AJAX neu laden

[Frank S.]

Hallo zusammen,

Ich bräuchte mal Hilfe mit AJAX und PHP.
Ich habe eine PHP-Datei, die mit jpGraph ein Bild erzeugt (z.B. bild.php). Ich möchte dieses Bild mit Hilfe von AJAX alle 5 Sekunden mit zwei Parametern neu laden.

Die PHP-Seite, die das machen soll, enthält einen leeren Bild-Tag, der von der Funktion gefüllt werden soll:
<img src="../bilder/nothing.gif" id="test" alt="">

Könnte mir bitte jemand sagen, wie die dazugehörige AJAX-Funktion aussehen muss?

Danke schon mal!

Gruß,
Frank

[Felix Riesterer]

Lieber Frank,

Ich bräuchte mal Hilfe mit AJAX und PHP.

und was genau kannst Du (noch) nicht, sodass Du dabei Hilfe brauchst?

Ich möchte dieses Bild mit Hilfe von AJAX alle 5 Sekunden mit zwei Parametern neu laden.

Wunderbarer Traffic... muss das wirklich sein?

Die PHP-Seite, die das machen soll, enthält einen leeren Bild-Tag, der von der Funktion gefüllt werden soll:
<img src="../bilder/nothing.gif" id="test" alt="">

Du willst bei Verwendung der als "Ajax" bezeichneten Technologie ein XML-Dokument erstellen und ausliefern. Siehe die einschlägigen Seiten wie z.B. AJAX bei Wikipedia oder XmlHttpRequest bei Mozilla

Könnte mir bitte jemand sagen, wie die dazugehörige AJAX-Funktion aussehen muss?

Aber klar: Objektorientiert!

Kommst Du nun besser zurecht?

Liebe Grüße,

Felix Riesterer.

[Frank S.]

Dass erste Beispiel, dass man ein Bild per Button ändern kann hilft mir überhaupt nicht - ich will es wie gesagt alle 5 Sekunden neu laden und JA, ich bin mir sicher, dass ich diesen Traffic generieren will, da es sich um eine Kurve zu Liveergebnissen handelt, die sich möglichst oft aktualisieren muss.

Beispielskripte zu AJAX habe ich mir etliche angeschaut - ich bräuchte aber eine konkrete Funktion, die genau das kann, was ich umsetzen will. Ich habe keins der Beispiele dafür anpassen können.

Könnte mir mal bitte jemand eine konkrete Funktion posten, die genau das kann?

[Cheatah]

Hi,

Dass erste Beispiel, dass man ein Bild per Button ändern kann hilft mir überhaupt nicht - ich will es wie gesagt alle 5 Sekunden neu laden

dann suchst Du also lediglich eine Möglichkeit, etwas alle 5 Sekunden zu machen. Wieso fragst Du dann nach etwas völlig anderem?

Beispielskripte zu AJAX habe ich mir etliche angeschaut - ich bräuchte aber eine konkrete Funktion, die genau das kann, was ich umsetzen will.

Per AJAX Grafiken auszutauschen ist grober Unfug. Zumal Du auf diese Weise den IE ausschließt, der mit data-URLs nicht klar kommt - und da nichts darauf hindeutet, dass Du mit SVG-Grafiken arbeitest, dürfte das die einzige Möglichkeit sein, einen entsprechenden AJAX-Response in ein <img>-Element zu injizieren.

Es sei denn, Du willst Request-Ping-Pong spielen und erst mal URLs abholen.

Könnte mir mal bitte jemand eine konkrete Funktion posten, die genau das kann?

Nein, wir können Dich erst mal nur auf die Fährte bringen, dass das, was Du vorhast, nicht dem entspricht, was Du machen möchtest. Dein Wunsch wurde bereits Mitte der 90er Jahre auf vielfältige Weise implementiert, also Generationen vor der Erfindung von AJAX.

Cheatah

[Frank S.]

Ich versuchs jetzt seit 4 Stunden mit allen möglichen Javascript-Codestücken und AJAX-Funktionen und nichts von alldem hat bisher geklappt. Vielleicht les ich einfach noch 5 Tage irgendwelchen Code - hat die letzten paar Stunden ja auch schon super funktioniert!?

Kann einfach mal jemand ein Stück Code posten, was das kann? Was ich im Internet zu Javascript gefunden habe funktioniert alles nur mit GIF und JPG aber sobald ich ne PHP-Datei mit Parametern habe, die ein Bild generiert, nicht mehr.

[Matze]

Hallo,

erstmal solltest du verstehen, dass unterhalb der Domain selfhtml.org von dir erwartet wird, dass du "Code" selbst erstellst.
Du hast dazu bereits sehr gute Links bekommen.

Ein anderes Problem ist dein Verständnis von/über AJAX.
Es gibt KEINE AJAX-Funktionen! 0, nicht 1!

Wie wär es denn wenn du dein Vorhaben mal in einer Gedankenkette zerlegst?!
z.B.
* Bild anzeigen
* nach/aller 5 Sekunden AJAX-Request mit 2 Parametern aufrufen
* Rückgabewert auswerten
* ggf. Bild aktuallisieren

* wo tritt ein Fehler auf??

Das ist nur ein grobes Beispiel, aber solche Sachen helfen dir und uns dein Problem einzugrenzen und zu verstehen.

Matze

[Felix Riesterer]

Lieber Frank,

Ich versuchs jetzt seit 4 Stunden mit allen möglichen Javascript-Codestücken und AJAX-Funktionen und nichts von alldem hat bisher geklappt.

logisch, denn Du weißt ja noch immer nicht, was Du technisch betrachtet genau tun willst.

Vielleicht les ich einfach noch 5 Tage irgendwelchen Code - hat die letzten paar Stunden ja auch schon super funktioniert!?

Ironie? Bei Verständnisverweigerern eine ungünstige Taktik.

Kann einfach mal jemand ein Stück Code posten, was das kann? Was ich im Internet zu Javascript gefunden habe funktioniert alles nur mit GIF und JPG aber sobald ich ne PHP-Datei mit Parametern habe, die ein Bild generiert, nicht mehr.

Denken wir doch einfach gemeinsam nocheinmal nach.

1.) Du hast ein PHP-Script, das Dir HTML-Code(!) generiert.
2.) Du hast ein HTML-Dokument, in dem ein JavaScript diesen von Deinem PHP-Script generierten HTML-Code dynamisch (per AJAX??) "nachladen" soll.
3.) Du willst etwas erreichen, das obige zwei Punkte überhaupt nicht benötigt.

Soweit klar? Nun kommt ein vernünftiger Lösungsansatz:

1.) Du hast ein PHP-Script, das Dir eine Bilddatei erzeugt (das Bild enthält eine grafische Datenauswertung) und kann z.B, darüber augerufen werden, dass man das PHP-Script als Bildquelle angibt:
<img id="Analysegrafik" src="http://example.org/bild-auswertung.php?time=1234567890" alt="Analysegrafik" />
2.) Du hast ein HTML-Dokument, in dem ein JavaScript alle fünf Sekunden das src-Attribut Deines Bildes ändert, indem es den (für das PHP-Script völlig irrelevanten) Wert des "time"-Parameters in der Bildadresse aktualisiert und so den Browser zwingt, das Bild erneut vom Server zu laden, anstatt das Bild aus dem Browsercache weiter zu benutzen.

Wo genau benötigst Du nun Hilfe?

Liebe Grüße,

Felix Riesterer.

[Cheatah]

Hi,

Ich versuchs jetzt seit 4 Stunden mit allen möglichen Javascript-Codestücken und AJAX-Funktionen und nichts von alldem hat bisher geklappt.

solange Du weiterhin versuchst, Dein Problem mit AJAX zu lösen, wird sich hieran auch nichts ändern. Ein Hammer ist ein wunderbares Werkzeug, aber er ist einfach nicht geeignet, um Scheiben zu putzen.

Kann einfach mal jemand ein Stück Code posten, was das kann? Was ich im Internet zu Javascript gefunden habe funktioniert alles nur mit GIF und JPG aber sobald ich ne PHP-Datei mit Parametern habe, die ein Bild generiert, nicht mehr.

Und welche Probleme hast Du bei dem Versuch, die von Dir gefundenen Codes a) zu verstehen und b) auf diese Anforderung hin anzupassen? Sprich mit uns, sonst kann Dir keiner helfen.

Cheatah

[Alexander (HH)]

Moin Moin!

Ein Hammer ist ein wunderbares Werkzeug, aber er ist einfach nicht geeignet, um Scheiben zu putzen.

Schonmal versucht? Bringt einen einzigartigen Durchblick, absolut streifen- und schlierenfrei, und vor allem bleibt das Fenster dauerhauft sauber!

Alexander

[Cheatah]

Hi,

Ein Hammer ist ein wunderbares Werkzeug, aber er ist einfach nicht geeignet, um Scheiben zu putzen.
Schonmal versucht? Bringt einen einzigartigen Durchblick, absolut streifen- und schlierenfrei, und vor allem bleibt das Fenster dauerhauft sauber!

das ist schon richtig, aber wenn man es nicht sehr gründlich macht, bleiben an den Rändern doch noch Streifen über, zumeist zackenförmig, die die Tendenz haben, sich rot zu färben. In der Informatik spricht man bei sowas von Seiteneffekten.

Cheatah

[ChrisB]

Hi,

Ich versuchs jetzt seit 4 Stunden mit allen möglichen Javascript-Codestücken und AJAX-Funktionen und nichts von alldem hat bisher geklappt. Vielleicht les ich einfach noch 5 Tage irgendwelchen Code - hat die letzten paar Stunden ja auch schon super funktioniert!?

Vielleicht leitest du daraus erst mal die Erkenntnis ab, dass „Herumprobieren” ohne Ahnung seltenst etwas bringt.

MfG ChrisB

[Felix Riesterer]

Lieber ChrisB,

Vielleicht ...

bemühe Dich nicht weiter, denn ich bin mir sicher, dass der nimmer vorbeischauen wird.

Liebe Grüße,

Felix Riesterer.

[hotti]

Dass erste Beispiel, dass man ein Bild per Button ändern kann hilft mir überhaupt nicht - ich will es wie gesagt alle 5 Sekunden neu laden

Gucks Dir noch einmal an, wie es funktioniert und welche Daten(*) dabei geändert werden.

und JA, ich bin mir sicher, dass ich diesen Traffic generieren will, da es sich um eine Kurve zu Liveergebnissen handelt, die sich möglichst oft aktualisieren muss.

Wenn Du obiges Beispiel verstanden hast, kannst Du die Daten(*) die veränderlich sind auch mit Ajax vom Server anfordern.

Hotti

[fastix®]

Moin!

Wenn Du obiges Beispiel verstanden hast, kannst Du die Daten(*) die veränderlich sind auch mit Ajax vom Server anfordern.

Ajax ist hier völlig fehl am Platz. Du willst sowas:

<html>  
<head>  
    <script type="text/javascript"  
    var nextInSec=5;  
  
    var nextInMilliSec=timeInSec*1000;  
    var counter=0;  
  
    window.setTimeout('BildHolen("webcam1")', nextInMilliSec;  
  
    function BildHolen(objId) {  
        obj=document.getElementById(objId);  
        counter++;  
        obj.src='http://www.example.org/pfad/image.png?foo=bar&counter='+counter;  
        window.setTimeout('BildHolen("webcam1")', nextInMilliSec;  
    }  
</script>  
</head>  
  
<body>  
    <img id="webcam1" alt="Webcam" src="http://www.example.org/pfad/image.png?foo=bar&counter=0" title="Das Bild wird aller 5 Sekunden oder auf Mausklick neu geladen." onclick="BildHolen('webcam1')" />  
</body>  
</html>

Du rufst x Sekunden (Konfiguriert in Variable nextInSec) die Funktion BildHolen(objId) ab. "objId" ist die ID des HTML-Elements img. Die Funktion baut den String zusammen, hierbei ist der Zähler (counter) wichtig, wird der nicht verändert lädt der Browser (der fest daran glaubt, dass eine Grafik eine Grafik und nichts dynamisches ist) keine Grafik von Server - die ist ja seiner Ansicht nach nicht neu. Mit dem Counter als Parameter schon. Die Funktion stellt einen Wecker und sorgt dafür, dass sie nach x Sekunden neu aufgerufen wird.

Hinweis: Der Beispielcode code ist ungetestet, muss ggf. noch debuggt werden.

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix

[fastix®]

Moin!

Tausche die Zeile:

var nextInMilliSec=timeInSec*1000;

gegen

var nextInMilliSec=nextInSec*1000;

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix

[Matze]

Hallo Felix,

Ich möchte dieses Bild mit Hilfe von AJAX alle 5 Sekunden mit zwei Parametern neu laden.

Wunderbarer Traffic... muss das wirklich sein?

unter Umständen schon, wenn man z.B. aller 5 Sekunden ein Bild einer "Live-Cam" ins Internet stellen will. 2 Parameter könnten z.B. sein Kamera-Id und Standort.

Ob das nun wirklich sein muss, lässt sich in Zeiten von Twitter, Facebook und MySpace* nur schwer beantworten.

Matze

*beepworld 2.0

[Guy Gaz]

Hallo!

Ich bräuchte mal Hilfe mit AJAX und PHP.

Den Zusammenhang sehe ich nicht.

Ich habe eine PHP-Datei, die mit jpGraph ein Bild erzeugt (z.B. bild.php). Ich möchte dieses Bild mit Hilfe von AJAX alle 5 Sekunden mit zwei Parametern neu laden.

Keine Ahnung, warum Du das brauchst, aber Dein img-Element hat ein src-Attribut, dessen Wert Du per Javascirpt ändern kannst - ein sehr altes Beispiel findest Du hier.

Könnte mir bitte jemand sagen, wie die dazugehörige AJAX-Funktion aussehen muss?

Wieso denn Ajax?

Ciao

GG

[fastix®]

Moin!

Du willst ein Lösungsbeispiel? Guckst Du hier:

https://forum.selfhtml.org/?t=193691&m=1294364

Ja, Sorry. Habs an der falschen Stelle gepostet.

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix