php pie chart, pie chart in php, generate custom pie chart using php and mysql, draw pie chart using PHP, generate pie chart

How to generate pie charts using PHP and MySQL

Data representation plays a major role in the way data is displayed to users. To ensure that the readers have a faster view of what the data entails without going into details, graphs and charts work well.

In situations where one is supposed to do a presentation of a particular product or demonstrate the data for an organization for a particular product to a panel, it is always recommended to show data in graphical format which usually captures the attention of readers easily.

In our previous tutorials, we discussed how to can represent custom data to line chart and bar graphs using PHP and MySQL.

In this article, we shall discuss how to generate pie charts using custom data with the help of PHP and MySQL such that the pie chart that will be generated will be dependent on custom data for a specific period or product.

A pie chart is one type of available graph that mainly represents or displays data in form of a graph, that is, the data to be shown is displayed in a circular format whereby each section is marked with a different color to distinguish between sections.

The bigger the section, the large the data it is representing. To know the actual data represented in each section, you place a cursor or hover in each section and the actual data will be displayed.

An advantage of using a pie chart is that it brings out the comparison between different data in a clear way since the sections are marked with different colors making it applicable to any user.

A disadvantage of a pie chart is that it can’t be used to show data over time.

How to generate custom pie charts using PHP and MySQL

To display custom data in a pie chart using PHP and MySQL, follow these steps;

  • Have the data to be displayed in the pie chart ready in the MySQL database.

In this case, we shall use a sample survey data for programming languages that developers prefer most. The data in the MySQL database table is as shown below

How to generate pie charts using PHP and MySQL

The SQL query to fetch the data from the database is as shown

SELECT language , usercount FROM preferences ORDER BY usercount ASC

  • Next, add the chart loader JavaScript file before initiating the pie chart functions. The chart loader JavaScript file has the necessary files and functions that will enable the pie chart to be visible.

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

  • Next, define google charts load and drawChart functions as shown below

<script type="text/javascript">

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

      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {

}

  • Inside drawChart() function, add the data selected from SQL database and assign it to a variable data

var data = google.visualization.arrayToDataTable([

          ['Programming Language','User Preference Count'],

          <?php

       $chkresults = mysqli_query($con,"SELECT language , usercount FROM preferences ORDER BY usercount ASC");

        while($row=mysqli_fetch_assoc($chkresults)){

           echo "['".$row["language"]."',".$row["usercount"]."],";

          }

         ?>

        ]);

 

  • Next, add other options like the title of the pie chart and also if you want a 3D, use is3D and set to true

var options = {

          title: 'Programming Languages preferences',

          is3D: true,

        };

  • Visualize the pie chart by matching the id where the pie chart will be displayed. Then draw the pie chart using chart.draw() method.

var chart = new google.visualization.PieChart(document.getElementById('pie-chart-location'));

        chart.draw(data, options);

  • Finally, define the div where the pie chart will be displayed using a unique id

<!--location where the pie chart will be displayed-->

        <div style="width:70%" id="pie-chart-location">

        </div>

The full code for generating pie chart using PHP and MySQL is as shown

<?php

// database connection

$con = mysqli_connect("localhost", "user", "database_password", "database_name") or die(mysqli_error($con));

?>

<html>

    <head><meta charset="utf-8">

        <!—chart loader js -->

        <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

    </head>

    <body>

    <script type="text/javascript">

// defining type of chart ( pie chart is defined using the core chart attribute)

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

      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {

        var data = google.visualization.arrayToDataTable([

          ['Programming Language','User Preference Count'],

          <?php

// fetch data from database table

       $chkresults = mysqli_query($con,"SELECT language , usercount FROM preferences ORDER BY usercount ASC");

        while($row=mysqli_fetch_assoc($chkresults)){

             // display array data of each result

           echo "['".$row["language"]."',".$row["usercount"]."],";

          }

         ?>

        ]);

// define title of the pie chart and set 3D to be true

        var options = {

          title: 'Programming Languages preferences',

          is3D: true,

        };

// match the unique id where the pie chart will be displayed

        var chart = new google.visualization.PieChart(document.getElementById('pie-chart-location'));

        chart.draw(data, options);

      }

    </script>

       

        <!--location where the pie chart will be displayed-->

        <div style="width:70%" id="pie-chart-location">

        </div>

    </body>

</html>

With the above steps, the pie chart below will be displayed

How to generate pie charts using PHP and MySQL

Conclusion

From the above discussion, we have highlighted what is a pie chart, defined the type of data that a pie chart is used to display, and also highlighted the advantages and disadvantages of using a pie chart in data presentation.

That’s it for this article, hope you can now generate pie charts using JavaScript, PHP, and MySQL.