Donut Chart using data from MySQL table by PHP![]()
Download Zip file at end of this tutorial. 1 : Collecting data from MySQL databaseAfter connecting to database through config.php file, we will run the SQL to collect the data from MySQL table. You can read more on MySQLi and how to collect data from table.
2 : Data array in PHPBefore displaying records in a table we have created an array in PHP ($php_data_array ). While displaying the records in a table we store each record inside the PHP array.
After displaying all the records in a table we have the $php_data_array with all the data collected from MySQL table. We can display the Json string like this.
3 : Transferring data from PHP to JavaScript to crate the chartBy using json_encode we will create an json string which can be used to create the JavaScript two dimensional array.
4 : Adding data to ChartOur JavaScript arraymy_2d stores all the data required for creating the chart. We need to display them in the format required by our Chart library.
We used parseInt() function to convert input string value to Integer.
JavaScript part is here .
5. HTML partWe can show the chart inside a <DIV> tag and place the same any where we want to display the chart.
The chart drawn above can be displayed with live internet connection as the library is to be loaded from gstatic.com Data is collected from MySQL database table so data can be edited by using script and the same will be reflected by the Chart. We have not included this part in the present script and there are many tutorials available here one handling data using PHP and MySQL. You can read tutorials on other types of charts displayed by using data from database.
This article is written by plus2net.com team.
![]() | ||||||||||