Thursday, 12 September 2019

Populate group data to a particular series on Highcharts

Trying to group tow columns and and populate it as a particular series on highcharts. my code not grouping columns, And showing all data as a single series.

$query = $db->Prepare("SELECT class, SUM(marks), DATE(date_column) as 
dates FROM classes GROUP BY class,DATE(date_column)");
$query->execute();
while ( $row = $query->fetch(PDO:: FETCH_ASSOC)) {
    $date = $row['dates'];
    $dates[] = $row['dates'];
    $class[] = $row['class'];
    $marks[] = $row['SUM(marks)'];

    $output[] = array($date,(int)$marks);

 }

echo json_encode(array('date'=>$dates,'marks'=>$marks, 'name' => $class)); 

JS

<script>
  $(document).ready(function () {
    $(function() {   
    $.getJSON('data.php', function(data) {
        // Create the chart
       Highcharts.chart('container', {
          title: {
          text: 'class Marks'
          },

            xAxis: {
                categories: data.dates
            },

        series : [{
            "name" : data.name,
            "data": data.marks
        }],

      });
   });
 });
});
</script>

Table

enter image description here

Expected output in JSFiddle

data response

date: ["2019-02-07", "2019-02-09", "2019-02-12", "2019-02-08", "2019-02-12", 
"2019-02-13", "2019-03-13",…]
marks: ["45", "166", "78", "64", "64", "627", "87", "352"]
name: ["claas 1", "claas 1", "claas 1", "class 2", "class 2", "class 2", "class 3", "class 3"]



from Populate group data to a particular series on Highcharts

No comments:

Post a Comment