2016-09-19 3 views
3

Ich suche nach einer Lösung, um die Summe der Menge pro Verkaufsmodell pro Monat anzuzeigen (mehrere Zeilen in einem Diagramm -> siehe Beispiel mit Originalcode unten).Generieren Google-Diagramm mit MySQL-Daten

Ich könnte eine while-Schleife verwenden, um durch die Vertriebsmodelle laufen mit:

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."');"; 
     } 

Wie würde man aber eine Schleife durch alle Tage/Monate/Jahre, auf dem ein Verkauf für die richtigen Verkäufe registriert ist Modell? Wie würde ich die Summe der Menge pro Verkaufsmodell wie die "Daten, addRows" unten erhalten.

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], 
    ]); 

Originalcode

<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>

Antwort

-1

Haben Sie versucht, mit $ajax?

Etwas wie:

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

Hallo Sergi, ich habe Ihren Vorschlag nicht versucht, oder als ich Angst habe, ich weiß nicht, was tun, ist :) Können Sie mir vielleicht zeigen, wie Sie den Code in Zusammenhang mit dem Skript arbeiten würde? –

+0

Ajax ist ein asynchroner Aufruf zu einer Anfrage, alle Websites verwenden das, es ruft Ihr PHP-Skript über Javascript, wenn das DOM bereit ist oder nicht –

0

google group() method hat, der wird dies für Sie tun

nur bieten auf, welche Spalten zu gruppieren und die Aggregationsformel für die verbleibenden Spalten

siehe folgende Arbeits Schnipsel wird ein Tabellenchart mit der Summe für jedes Verkaufsmodell gezeichnet ...

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>

+0

ein Glück mit dieser Frage? – WhiteHat