Jump to content
Sign in to follow this  
matfire88

[highchart]Inserimento dati da graficare

Recommended Posts

Salve a tutti, questo è il mio primo messaggio quindi prima di tutto un saluto.

 

Allora, premetto che io non sono un programmatore esperto. Mi trovo a dover generare una singola pagina web per un progetto all'università che mostri in un grafico (o due separati) una curva statica generata attraverso alcuni parametri inseriti in un form e un'altra live, l'idea è che io devo generare un file di log sul mio pc (penso un CSV) e in tempo reale aggiornare il grafico.

 

Ho trovato questa libreria di grafici javascript molto bella, ho guardato i loro esempi ma non riesco proprio a trovare un modo. In particolare avrei visto un esempio che assegna a due variabili il tempo preso dal pc e un valore random per l'asse delle y. Se riuscissi a sostituire alla funzione che genera questo numero random un'altra che invece mi prende il dato da un file esterno sarei a posto. Potete aiutarmi?

 

Ecco il codice su cui sto provando e che potrete trovare anche nel txt allegato:

 

 

 

<!DOCTYPE HTML>
<html>
   <head>
       <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
       <title>Highstock Example</title>


       <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
       <script type="text/javascript">
$(function() {

   Highcharts.setOptions({
       global : {
           useUTC : false
       }
   });

   // Create the chart
   $('#container').highcharts('StockChart', {
       chart : {

           events : {
               load : function() {
               // set up the updating of the chart each second
                   var series = this.series[0];
                   setInterval(function() {
                       var x = (new Date()).getTime(), // current time
                       y=5;

                   $.get('data.csv', function(data) {
                                     var lines = data.split('\n');              //carica tot righe di dati
                                     $.each(lines, function(lineNo, line) {   //per ogni riga separa i dati
                                                                             //e inserisce la prima parte 
                          y=1;                                        // in c e la seconda in d

                      });
                   });


                       series.addPoint([x, y], true, true);
                   }, 2000);
               }
           }
       },

       rangeSelector: {
           enabled: true,            
           buttons: [{
               count: 1,
               type: 'minute',
               text: '1M'
           }, {
               count: 5,
               type: 'minute',
               text: '5M'
           }, {
               type: 'all',
               text: 'All'
           }],
           inputEnabled: false,
           selected: 0
       },

       title : {
           text : 'Live random data'
       },
       xAxis: {
           minrange: 3600000,
           startOnTick: true,
           minPadding: 3600000,
           minTickInterval: 400,



       },


       exporting: {
           enabled: true
       },

       series : [{
           name : 'Random data',
           data : (function() {
               // generate an array of random data
               var data = [], time = (new Date()).getTime(), i;


               for( i = -999; i <= 0; i++) {

                   data.push([
                       time + i * 1000,
                       0
                   ]);
               }
               return data;
           })()
       }]
   });


});


       </script>
   </head>
   <body>
<script src="../../js/highstock.js"></script>
<script src="../../js/modules/exporting.js"></script>


<div id="container" style="height: 500px; min-width: 500px"></div>
   </body>
</html>

 

 

 

Da quello che ho capito la funzione $.get dovrebbe fare al caso mio ma non so come fare in modo che ad ogni chiamata (2000ms in questo caso, giusto?) mi prenda l'ultimo dato generato nel foglio per aggiornare il grafico. La cosa che proprio non capisco poi è che la funzione get sembrerebbe proprio ignorata dal compilatore. Infatti non ci sono errori quando carico la pagina , lo script del grafico parte con il tempo che va avanti ma il valore di y rimane 0 anche se secondo me dovrebbe disegnare una costante uguale a 1....AIUTO!! :-)

index.txt

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×