Erhöhung um 10 Sekunden für Google Liniendiagramm

Question

Ich habe 2000+ Datensätze, die in der JSON-Datei gespeichert wurden. Meine Aufgabe ist es, diese Daten mit Ajax in Google Liniendiagramm zu laden. Bisher kann ich erfolgreich laden und mein Javascript Aufruf ist wie folgt:

$(document).ready(function() { 
    $.ajax({ 
     url: 'assets/data/ntx1000.json', 
     dataType: 'json', 
     type: 'GET', 
     success: function(data) { 
      console.log(data); 
      var activeData = data.Active; 
      var OffData = data.OFF; 
      var idleData= data.Idle; 
      var dataRows = []; 
      var time= 0; 

      google.charts.load('current', {packages: ['corechart', 'line']}); 
      google.charts.setOnLoadCallback(drawLineColors); 

      for(var i=0;i <activeData.length ; i++){ 
       dataRows.push(activeData[i]); 
      } 

      function drawLineColors() { 
       var data = new google.visualization.DataTable(); 
       data.addColumn('number', 'Time'); 
       data.addColumn('number', 'Idle'); 
       data.addColumn('number', 'Off'); 
       data.addColumn('number', 'Active'); 

       for(var i=0;i <activeData.length ; i++){ 
        time=time+0.01; 
        data.addRows([[time, idleData[i] , OffData[i], activeData[i]]]); 
       } 

       var options = { 
        hAxis: { 
         // title: 'Time' 
        }, 
        vAxis: { 
         //title: 'Popularity' 
        }, 
        colors: ['#1b53b2', 
         '#073b4c', 
         '#359C19'], 
        'legend':'bottom' 
       }; 

       var chart = new google.visualization.LineChart(document.getElementById('consumption24Hour')); 
       chart.draw(data, options); 
      } 
     }, 
     error:function(){ 
      console.log("error"); 
     } 

    }); 

}); 

Meine Absicht für jede Sekunde, ich will ein Datensatz dem Diagramm hinzuzufügen, möchte ich von 08.00 Uhr bis zur Aufzeichnung starten endet. Derzeit, da ich nicht weiß, wie in time=time+0.01; zu meinem Code hinzufügen. Wie kann ich dem Google-Diagramm Zeit hinzufügen? Folgendes ist das Diagramm, das aus den Daten erstellt wurde.

Answer 1

Ich habe versucht, mit Google-Diagramm zu spielen und fand eine Methode, die ich implementieren kann.

$(document).ready(function() { 
$.ajax({ 
    url: 'assets/data/ntx1000.json', 
    dataType: 'json', 
    type: 'GET', 
    success: function(data) { 
     console.log(data); 
     var activeData = data.Active; 
     var OffData = data.OFF; 
     var idleData= data.Idle; 
     var dataRows = []; 
     var time= 0; 

     google.charts.load('current', {packages: ['corechart', 'line']}); 
     google.charts.setOnLoadCallback(drawLineColors); 

     for(var i=0;i <activeData.length ; i++){ 
      dataRows.push(activeData[i]); 
     } 

     function drawLineColors() { 
      var data = new google.visualization.DataTable(); 
      data.addColumn('datetime', 'Month'); 
      data.addColumn('number', 'Idle'); 
      data.addColumn('number', 'Off'); 
      data.addColumn('number', 'Active'); 

      for(var i=0;i <activeData.length ; i++){ 
       time= new Date(2017, 10, 20, 8, 00, 01+i); 
       // var time = new Date(2014, 2, 20, 8, 30); 
       data.addRows([[time, idleData[i] , OffData[i], activeData[i]]]); 
      } 

      var options = { 
       hAxis: { 
        // title: 'Time' 
        // format: 'H:M' 
       }, 
       vAxis: { 
        //title: 'Popularity' 
       }, 
       colors: ['#1b53b2', 
        '#073b4c', 
        '#359C19'], 
       'legend':'bottom' 
      }; 

      var chart = new google.visualization.LineChart(document.getElementById('consumption24Hour')); 
      chart.draw(data, options); 
     } 
    }, 
    error:function(){ 
     console.log("error"); 
    } 

}); 

});

Ich hoffe, es wird anderen helfen.