使用mysql数据生成Google图表

I'm looking for a solution to display the Sum of Quantity per sales model per month (multiple lines in one chart --> see sample with original code below).

I could use a while loop to run through the Sales Models with:

   var data = new google.visualization.DataTable();
    data.addColumn('number', 'Day');
    <?php
        $query = "SELECT DISTINCT Model FROM stats LIMIT 3";
        $result = mysql_query($query);

        while ($row = mysql_fetch_array($result))
        {
            $value = $row['Model'];
            echo "data.addColumn('number', '".$value."');";
        }

How would one however loop through all the Days/Months/Years on which a sale is registered for the right Sales Model? How would I get the Sum of Quantity per Sales Model like the "data,addRows" below.

  data.addRows([
    [1,  37.8, 80.8, 41.8],
    [2,  30.9, 69.5, 32.4],
    [3,  25.4,   57, 25.7],
    [4,  25.4,   57, 25.7],
    [5,  25.4,   57, 25.7],
    [6,  25.4,   57, 25.7],
  ]);

Original code

 <html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      
google.charts.load('current', {'packages':['line']});
google.charts.setOnLoadCallback(drawChart);

  function drawChart() {

      var data = new google.visualization.DataTable();
      data.addColumn('number', 'Day');
      data.addColumn('number', 'Sales Model 1');
      data.addColumn('number', 'Sales Model 2');
      data.addColumn('number', 'Sales Model 3');

      data.addRows([
        [1,  37.8, 80.8, 41.8],
        [2,  30.9, 69.5, 32.4],
        [3,  25.4,   57, 25.7],
        [4,  25.4,   57, 25.7],
        [5,  25.4,   57, 25.7],
        [6,  25.4,   57, 25.7],
      ]);

      var options = {
        chart: {
          title: 'Sales',
        },
        width: 900,
        height: 500
      };

      var chart = new google.charts.Line(document.getElementById('linechart_material'));

      chart.draw(data, options);
    }
    </script>
  </head>
  <body>
    <div id="linechart_material" style="width: 900px; height: 500px"></div>
  </body>
</html>

</div>

Did you try with $ajax ?

Something like:

   $.ajax({
        method: "GET",
        url: "sales.php",
        })
        .done(function( data ) {
           data.addRows(data);
      });

google has group() method that will do this for you

just provide which columns to group on and the aggregation formula for the remaining columns

see following working snippet, a table chart is drawn with the sum for each sales model...

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

function drawChart() {
  var data = new google.visualization.DataTable();
  data.addColumn('number', 'Day');
  data.addColumn('number', 'Sales Model 1');
  data.addColumn('number', 'Sales Model 2');
  data.addColumn('number', 'Sales Model 3');

  data.addRows([
    [1,  37.8, 80.8, 41.8],
    [2,  30.9, 69.5, 32.4],
    [3,  25.4,   57, 25.7],
    [4,  25.4,   57, 25.7],
    [5,  25.4,   57, 25.7],
    [6,  25.4,   57, 25.7],
  ]);

  var options = {
    chart: {
      title: 'Sales',
    },
    width: 900,
    height: 500
  };

  var chart = new google.charts.Line(document.getElementById('linechart_material'));
  chart.draw(data, options);

  var dataGroup = google.visualization.data.group(
    data,
    // modifier column to total all rows
    [{column: 0, type: 'string', modifier: function () {return '';}}],
    // sum columns
    [
      {column: 1, type: 'number', aggregation: google.visualization.data.sum},
      {column: 2, type: 'number', aggregation: google.visualization.data.sum},
      {column: 3, type: 'number', aggregation: google.visualization.data.sum}
    ]
  );

  var table = new google.visualization.Table(document.getElementById('tablechart'));
  table.draw(dataGroup);
}

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

</div>