Wie eine Echtzeit-Graphen plotten (Histogramm) unter Verwendung von in einer Textdatei gewonnenen Daten

StackOverflow https://stackoverflow.com/questions/1728937

Frage

habe ich ein kontinuierlich erzeugten Daten (Textdatei) durch ein Programm auf dem Server generiert. Ich möchte die Daten als Echtzeit-Grafik zeichnen wie Powergrid tut. Das war mein Ansatz:

Da die Daten kontinuierlich auf dem Server in einer Textdatei erzeugt werden, habe ich einen PHP-Skript, das die Datei (get_file_contents) liest, gibt die Datenpunkte und zeichnen Sie die Grafik mit Spark jQuery-Plugin. Aber das Problem ist, dass es die Datei liest auf einmal . Darüber hinaus hält die Textdatei auf das Wachstum. Kann jemand empfehlen, mir einen besseren Ansatz?

War es hilfreich?

Lösung

Wie Sie sprechen eine Javascript Plotten Lösung zu verwenden Sie wie folgt vor:

  • Laden der Seite erstellen Sie das aktuelle Diagramm durch die vollständige Textdatei zu lesen und seine Größe zu erinnern.
  • , nachdem die Seite geladen wird, erstellen Sie eine Javascript-Funktion, die regelmäßig Umfragen ein spezifisches Skript auf Ihrem Server AJAX-Techniken (XMLHttpRequest) und das Bestehen die letzte bekannte Dateigröße Ihrer Textdatei als Parameter.
  • Ihr Polling Skript nimmt die Dateigröße Parameter, öffnet die Textdatei, springt durch die Datei, bis sie den Punkt erreicht, von dem aus Sie die Datei zuletzt (Dateigröße-Parameter) gelesen.
  • die Polling-Skript gibt alle verfügbaren Daten von Dateigröße an das Ende der Datei und der neuen File
  • Ihre Javascript liest in der AJAX-Antwort und fügt die erforderlichen Plotpunkte zu Ihrem Diagramm
  • Sie können dann Abfrage starten über Ihre serverseitiges Skript mit der neuen Dateigröße als Parameter

Dieses Verfahren beinhaltet Server-Seite als auch clientseitige Programmierung, sondern kann leicht erreicht werden.

Im Folgenden ist ein Beispiel Polling-Skript, das eine index Paramater erfordert, die das Skript erzählt von welcher Position die Textdatei und gibt eine JSON-codierte Liste der Plotpunkte und der neue Index-Zeiger zu lesen.

// poll.php
$index = (isset($_GET['index'])) ? (int)$_GET['index'] : 0;
$file = fopen('path/to/your/file.txt', 'r');
$data = array(
    'index' => null,
    'data'  => array()
);
// move forward to the designated position
fseek($file, $index, SEEK_SET);
while (!feof($file)) {
    /*
     * assuming we have a file that looks like
     * 0,10
     * 1,15
     * 2,12
     * ...
     */
    list($x, $y) = explode(',', trim(fgets($handle)), 2);
    $data['data'][] = array('x' => $x, 'y' => $y);
}
// set the new index
$data['index'] = ftell($file);
fclose($file);

header('Content-Type: application/json');
echo json_encode($data);
exit();

Die entsprechende Javascript / jQuery Snippet könnte sein:

// the jQuery code to poll the script
var current = 0;
function pollData() {
    $.getJSON('poll.php', { 'index': current }, function(data) {
        current = data.index;
        for (var i= 0; i < data.data.length; i++) {
            var x = data.data[i].x;
            var y = data.data[i].y;
            // do your plotting here
        }
    });
}
// call pollData() every 5 seconds
var timer = window.setInterval(pollData, 5000);

Bitte achten Sie darauf, dass dies nur ein Beispiel, und dass es fehlt alle Fehlerprüfung (zum Beispiel gleichzeitige Anrufe zu pollData() auf der gleichen Seite wird problematisch sein).

Andere Tipps

Es klingt wie Sie das Visualisierungsteil meist ausgearbeitet haben. Wenn der Datensatz neu zu berechnen zu groß ist, können Sie für die Aufrechterhaltung der inkrementellen Histogramme in Techniken zu suchen. Hier sind ein paar Papiere, die helfen können:

Als erstes würde ich die Grafik auf der Benutzerseite nicht erzeugen. Das hat einfache Gründe:. Nicht jeder hat JavaScript aktivieren, damit (okay, hängt von Ihrer Zielgruppe), und es ist wahrscheinlich nicht sehr schnell

Da Sie bereits mit PHP sind, würde ich empfehlen deshalb ein Paket mit wie pChart für die Erstellen von Diagrammen auf der Serverseite. Ein weiterer positiver Nebeneffekt dabei ist, dass die Verpackung mit Caching kommt, zu. Dies würde zum Beispiel können Sie das Diagramm nur schaffen, wenn die Datentextdatei geändert wird (vorausgesetzt, Sie erzeugen, dass mit PHP, auch - sonst können Sie einfach überprüfen, ob die Datei jedes Mal, Ihre PHP-Skript ausgeführt wird geändert wurde) und damit Speichern Lasten der Ressourcen;)

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top