Senden Sie Daten an Google-Diagramm-Funktion

Question

Ich habe 3 Google-Diagramme, die abgesehen von den Daten und ID des Diagramms identisch sind. Im Moment nenne ich diese Diagramme so.

google.charts.setOnLoadCallback(drawBasic); 
google.charts.setOnLoadCallback(drawBasic2); 
google.charts.setOnLoadCallback(drawBasic3); 

Da die Diagramme sind fast identisch ich eine Funktion anstelle von 3 möchte, da ich weniger Code verwenden möchten, wenn möglich, aber wenn ich dies tun, funktioniert es nicht. google.charts.setOnLoadCallback (drawBasic (mydata, myid));

Wenn ich die Daten so senden könnte, würde ich nicht 3 Funktionen benötigen, würde ich nur eine Funktion drawBasic, mit verschiedenen Daten jedes Mal, wenn es aufgerufen wird. Ich werde nicht alle 3 Funktionen einfügen Ich werde nur die eine Funktion einfügen, um zu zeigen, wie meine Funktion ausgelegt ist.

function drawBasic() { 
    var data = new google.visualization.DataTable(); 
    data.addColumn('date', 'Month'); 
    data.addColumn('number', 'Sales'); 

    data.addRows([ 
     [new Date(2016, 4), 0],[new Date(2016, 5), 0],[new Date(2016, 6), 0],[new Date(2016, 7), 0],[new Date(2016, 8), 0],[new Date(2016, 9), 0] 
    ]); 

    var options = { 
     title: 'Total Sales Last Six Months', 
     hAxis: { 
      title: 'Sales' 
     }, 
     vAxis: { 
      title: 'Month' 
     }, 
      backgroundColor: { fill:'transparent' }, 
      legend: {position: 'none'}, 
      'animation':{duration:1000,easing:'out'} 
    }; 
    var chart = new google.visualization.BarChart(document.getElementById('total_sales_chart')); 

    chart.draw(data, options); 

    setTimeout(function(){ 
     data.setValue(0,1,14690); 
     data.setValue(1,1,2785); 
     data.setValue(2,1,23345); 
     data.setValue(3,1,10345); 
     data.setValue(4,1,12456); 
     data.setValue(5,1,19642); 
     chart.draw(data, options); 
    },1000);  
} 

So ist es mir möglich, meine Daten an die Funktion zu senden. Ich bin neu in Google-Charts, aber wo es möglich ist, benutze ich nicht gerne 3 Funktionen, wenn ich nur mit einem davon komme.

Answer 1

setOnLoadCallback soll verwendet werden einmal pro Seite Last

Sie jedoch

dann die callback zum load Anweisung hinzufügen: Ihre drawBasic Funktion wird also wie folgt aufgerufen werden rufen Sie die Zeichenfunktion von dort ...

google.charts.load('current', { 
    callback: function() { 
    drawBasic(mydata1, myid1); 
    drawBasic(mydata2, myid2); 

    function drawBasic(data, id) { 
     ... 
    } 
    }, 
    packages: ['corechart'] 
}); 

Answer 2

Do sth wie:

var data=[[1,2],[3,4]]; 
google.charts.setOnLoadCallback(function(){ 
for(i=0;i<data.length;i++){ 
drawBasic(data[i]); 
} 
}); 

Diese kleine Funktion ruft drawBasic mit einem Array-Element als Argumente Liste.

drawBasic([1,2]); 
drawBasic([3,4]);