2016-05-12 8 views
1

Heey alle,hinzufügen Zeitskalierung auf Linechart (Chart.js)

ich chartjs bin mit einem Blick Diagramme zu erzeugen. Die Daten werden jetzt korrekt geladen, aber ich habe Probleme mit den X-Achsen-Etiketten. Da Chart.js eine Zeitskala unterstützt, habe ich mich gefragt, wie es funktioniert? Die Zeitleiste sollte dynamisch sein. Und sollte im Laufe der Zeit Werte zeigen.

Dies ist, was ich bisher versucht habe, aber irgendwie bekomme ich keine Zeitwerte auf meiner X-Achse. https://jsfiddle.net/fwxvb2zp/1/

Ich verwende die neueste Chart.js (2.1.2)

Wie ihr vielleicht innerhalb des Objekts sehen, gibt es einen Zeitstempel zur Verfügung. Dies ist der Zeitstempel für die Daten, die in das Diagramm eingefügt werden sollen. Das Objekt i Senden bin ist wie folgt:

var object = [ 
    { 
     "avg_c_p_u":[ 
      0.56, 
      0.38, 
      0.33 
     ], 
     "timestamp":1463054879000 
    } 
] 

Antwort

1
see below updated method from your jsFiddle code: 
add below 2 lines: 

chartdata.data.labels.shift(); 
chartdata.data.labels.push(Math.random().toFixed(2)); 


$.each(data, function() { 
    var tmp = chartdata.data.datasets[0].data; 
    tmp.shift(); 
    tmp.push(this['avg_c_p_u'][0]*100); 
    chartdata.data.datasets[0].data = tmp; 
    chartdata.data.labels.shift(); //new line 
    chartdata.data.labels.push(Math.random().toFixed(2));//new line 
    chartdata.update(); 
    }); 
Verwandte Themen