[highchart]Inserimento dati da graficare

[matfire88]

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?

il codice su cui sto lavorando è questo:

$(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 = Math.round(Math.random() * 100);
					series.addPoint([x, y], true, true);
				}, 1000);
			}
		}
	},
.
.
.

e io per prova ho modificato cosi:

$(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;
						
				$.get('data2.csv', function(data) {
            		             y=1;
       		 	         });
				series.addPoint([x, y], true, true);
				 }, 2000);
				}
			}
		},
.
.
.

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!! :-)

[simone.fontana]

Il mio consiglio è quello di caricare i file in un database, magari puoi fare un lettore di CSV che legga il file e lo inserisca nel database.

Per quanto riguarda i grafici ti consiglio la libreria di google: https://developers.google.com/chart/ sul sito trovi tutte le informazioni per come utilizzarla.

Per quanto riguarda l'aggiornamento automatico ti consiglio di utilizzare AJAX, prima crei un cron in javascript che ogni tot legge i dati dal database e ti aggiorna i grafici.

Tutto ciò può avvenire grazie ad AJAX che legge i dati e con javascript aggiorni i grafici senza dover ricaricare la pagina.

[matfire88]

Ciao, grazie per la risposta.
Alla fine ho risolto modificando un po il codice del primo post e prendendo dal CSV, creato direttamente in una cartella del mio pc senza database, sia l'ora che il valore per poi inserirli con un push come nuovo elemento nell'array di vettori "series" che il grafico interpreta rispettivamente come valore dell'asse x e dell'asse y.