SySyBy
SySyBy

Reputation: 957

How to make a graph using PHP from oracle

I want to create a graph that the data are from oracle by using php. I did not found example that use oracle as a database. Mostly are from mysql. The data is like this

enter image description here

I have made this code but it's not working. its show like thisenter image description here

data.php

   <?php
    header('Content-Type: application/json');
    $conn = oci_connect('***', '***', '127.0.0.1/orcl');

    $graph=sprintf("SELECT count(pm.packagename) as quantity,pm.packagename
        FROM packagemenu pm
        INNER JOIN orderdetail od ON od.packageid=pm.packageid
        inner join orders o on o.orderid = od.orderid
        group by pm.packagename");
     $parse=oci_parse($conn,$graph);
    oci_execute($parse);
    $data=array();
    while($row1 = oci_fetch_array($parse)){
    $data[]=$row1;

    }
     print json_encode($data);

    ?>

bargraph.html

<!DOCTYPE html>
<html>
<head>
    <title>ChartJS - BarGraph</title>
    <style type="text/css">
        #chart-container {
            width: 640px;
            height: auto;
        }
    </style>
 </head>
 <body>
    <div id="chart-container">
        <canvas id="mycanvas"></canvas>
    </div>

    <!-- javascript -->
    <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="js/Chart.min.js"></script>
    <script type="text/javascript" src="js/app.js"></script>
 </body>

apps.js

  $(document).ready(function(){
  $.ajax({
    url: "http://localhost/psm/admin/data.php",
    method: "GET",
    success: function(data) {
        console.log(data);
        var packagename = [];
        var quantity = [];

        for(var i in data) {
            packagename.push("Packagename " + data[i].packagename);
            quantity.push(data[i].quantity);
        }

        var chartdata = {
            labels: packagename,
            datasets : [
                {
                    label: 'Package Name',
                    backgroundColor: 'rgba(200, 200, 200, 0.75)',
                    borderColor: 'rgba(200, 200, 200, 0.75)',
                    hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
                    hoverBorderColor: 'rgba(200, 200, 200, 1)',
                    data: quantity
                }
            ]
        };

        var ctx = $("#mycanvas");

        var barGraph = new Chart(ctx, {
            type: 'bar',
            data: chartdata
        });
      },
      error: function(data) {
        console.log(data);
      }
    });
 });

Upvotes: 1

Views: 1024

Answers (1)

Tim
Tim

Reputation: 2187

Since the data is this:

 [{"0":"8","QUANTITY":"8","1":"Set A","PACKAGENAME":"Set A"},{"0":"5","QUANTITY":"5","1":"Set B","PACKAGENAME":"Set B"}]

You have a case sensitivity problem, which makes the array var packagename and quantity empty/undifined.

You need to change:

    for(var i in data) {
        packagename.push("Packagename " + data[i].packagename);
        quantity.push(data[i].quantity);
    }

... to ...

    for(var i in data) {
        packagename.push("Packagename " + data[i].PACKAGENAME);
        quantity.push(data[i].QUANTITY);
    }

I am not familiar with Chart.js but fixing this so that you are not trying to graph undefined variables is a first step.

Upvotes: 2

Related Questions