Dynamische Grafik mittels AJAX

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Dynamische Grafik mittels AJAX

    Hallo,

    ist es möglich mittels AJAX und Co. eine Grafik dynamisch zu gestallten?

    Ich habe folgendes vor:
    Ich werde es mal vereinfacht beschreiben.

    Stellt euch vor, ihr hätte eine Modelleisenbahn. Und Ihr möchtet Online verfolgen wo sich der Zug im Moment auf der Strecke befindet.
    Allerdings möchte ich die Position dynamisch haben, also ich rufe die Seite auf und die Position ändert sich kontinuierlich. Ohne das sich die Seite neu lädt. Der Zug fährt also Virtuell auf der Strecke. Die aktuellen Positionsdaten bekomme ich aus einer Datenbank.

    Mittels GD Library und html refresh, ist es kein Problem, aber hierbei habe ich immer wieder das Neuladen der Seite im vorgegebenen Rütmus.

    Habt ihr eine Idee? Wie würdet Ihr dies Realisieren?


    Vielen Danke

    Gruß
    Andreas
    Bilder

    • Skizze.JPG

      23,35 kB, 870×526, 1.676 mal angesehen

  • klar, sollte kein problem sein

    les dir erstmal diese howto durch: [coderwiki]HowTos/Ajax-Server-zu-Client-Kommunikation[/coderwiki]

    laden brauchst du dann nur 2 positionsdaten
    am besten mit den fertigen bildschirmkoordinaten
    z.B. so 100||234

    bei änderung änderst du einfach die position des divs

    Quellcode

    1. var response = req.responseText;
    2. update = response.split('||');
    3. document.getElementById(update[i]).style.left = update[0];
    4. document.getElementById(update[i]).style.top = update[1];


    hier das div

    Quellcode

    1. <div id="zug" style="position:absolute;left:0px;top:0px"><img src="" alt="" /></div>