Comment tracer un graphique en temps réel (histogramme) à partir de données obtenues dans un fichier texte

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

Question

J'ai données générées en continu (fichier texte) générés par un programme sur le serveur. Je veux tracer les données sous forme de graphique en temps réel comme powergrid fait. Ce fut mon approche:

Comme les données sont générées en continu sur le serveur dans un fichier texte, je l'ai écrit un script PHP qui lit ce fichier (get_file_contents), délivre les points de données et tracer le graphique en utilisant sparkline plugin jQuery. Mais le problème est qu'il lit le fichier à la fois . De plus, le fichier texte ne cesse de croître. Quelqu'un peut-il me suggérer une meilleure approche?

Était-ce utile?

La solution

Comme vous parlez d'utiliser une solution de traçage Javascript vous procédez comme suit:

  • sur la charge de page que vous créez le graphique actuel en lisant le fichier texte complet et se souvenant de sa taille.
  • après la page est chargée de créer une fonction JavaScript qui interroge régulièrement un script spécifique sur votre serveur en utilisant des techniques AJAX (XMLHttpRequest) et en passant le filesize dernier connu de votre fichier texte en tant que paramètre.
  • votre script de vote prend le paramètre de taille du fichier, ouvre le fichier texte, saute dans le fichier jusqu'à ce qu'il atteigne le point à partir duquel vous lisez le dernier fichier (taille du fichier paramètre).
  • le script de vote retourne toutes les données disponibles à partir de taille du fichier à la fin du fichier et le nouveau FileSite
  • votre Javascript lit dans la réponse AJAX et ajoute les points de terrain nécessaires à votre graphique
  • vous pouvez alors recommencer script interrogation votre côté serveur avec la nouvelle taille du fichier en tant que paramètre

Cette procédure implique côté serveur ainsi que la programmation côté client, mais peut se faire facilement.

Ce qui suit est un script de sondage de l'échantillon qui nécessite une paramater de index qui indique le script à partir de laquelle la position pour lire le fichier texte et retourne une liste codée JSON de points de tracé et le nouveau pointeur d'index.

// 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();

L'extrait Javascript / jQuery correspondant pourrait être:

// 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);

S'il vous plaît faites attention que ceci est seulement un exemple et qu'il n'a pas toutes les erreurs de contrôle (par exemple des appels simultanés à pollData() sur la même page sera problématique).

Autres conseils

Il semble que vous avez la partie de visualisation principalement élaboré. Si l'ensemble de données est trop grand pour recalculera, vous voudrez peut-être se pencher sur des techniques pour maintenir histogrammes supplémentaires. Voici quelques documents qui peuvent aider:

Tout d'abord, je ne générer le graphique sur le côté utilisateur. Cela a des raisons simples. Tout le monde a JavaScript activé (ok, dépend de votre groupe cible) et il est probablement pas très rapide

Puisque vous utilisez déjà PHP, je vous recommande donc d'utiliser un paquet comme pChart pour créer les graphiques sur le côté serveur. Un autre effet secondaire positif est que ledit paquet est livré avec la mise en cache, aussi. Ceci, par exemple, vous permet de créer le graphique uniquement lorsque le fichier texte de données est modifiée (en supposant que vous générez que PHP, aussi - sinon vous pouvez simplement vérifier si le fichier a été modifié à chaque fois que votre script PHP est exécuté) et donc économiser des charges de ressources;)

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top