Wie kann ich neue Spalte und seine Daten mit Google Diagramm API

Question

hinzufügen Ich habe Idee, wie kann ich neue Person nach "George" und seine Daten für das Jahr Januar bis April dynamisch hinzufügen. Wie kann ich mein gewünschtes Ergebnis erzielen? Hier ist der Code, die ich verwende:

<script type="text/javascript"> 
    google.charts.load('current', {'packages':['corechart']}); 
    google.charts.setOnLoadCallback(drawChart); 

    function drawChart() { 
    var data = google.visualization.arrayToDataTable([ 
     ['Year', 'Wilson', 'Jennifer','George'], 
     ['Jan', 1000,  400,88], 
     ['Feb', 1170,  460,99], 
     ['March', 660,  1120,55], 
     ['April', 1030,  540,33] 
    ]); 

    var options = { 
     title: 'Company Performance', 
     curveType: 'function', 
     legend: { position: 'bottom' }, 
     pointSize: 20, 
     pointShape: 'square' 

    }; 

    var chart = new google.visualization.LineChart(document.getElementById('curve_chart')); 
    //data.addColumn('summit'); 
    chart.draw(data, options); 
    } 
</script> 

Answer 1

verwenden, um die addColumn Methode
Sie den zurückgegebenen Spaltenindex speichern können die Zeilen
einhüllen Sie mehrere Spalten aktualisieren möchten

in der folgenden hinzufügen beispielsweise die Werte für die neue Spalte werden aus einer vorherigen Spalte berechnet

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

 
function drawChart() { 
 
    var data = google.visualization.arrayToDataTable([ 
 
    ['Year', 'Wilson', 'Jennifer','George'], 
 
    ['Jan', 1000,  400,88], 
 
    ['Feb', 1170,  460,99], 
 
    ['March', 660,  1120,55], 
 
    ['April', 1030,  540,33] 
 
    ]); 
 

 
    var colIndex = data.addColumn('number', 'New'); 
 
    for (var i = 0; i < data.getNumberOfRows(); i++) { 
 
    data.setValue(i, colIndex, data.getValue(i, colIndex - 1) * 2); 
 
    } 
 

 
    var options = { 
 
    title: 'Company Performance', 
 
    curveType: 'function', 
 
    legend: { position: 'bottom' }, 
 
    pointSize: 20, 
 
    pointShape: 'square' 
 

 
    }; 
 

 
    var chart = new google.visualization.LineChart(document.getElementById('chart_div')); 
 
    chart.draw(data, options); 
 
}

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="chart_div"></div>