renatoschroepfer/Grafpie

## data.php
<?php
$db = new mysqli('localhost', 'root', 'password', 'test');
if ($db->connect_error)
	die('Connection failed: '.$db->connect_error);

$query = 'SELECT * FROM `alunos`';
$execute = $db->query($query);

$series1 = array(
	'name' => 'João',
	'data' => array()
);

$series2 = array(
	'name' => 'Maria',
	'data' => array()
);

$series3 = array(
	'name' => 'Neto',
	'data' => array()
);

while ($result = $execute->fetch_assoc()) {
	array_push($series1['data'], (integer) $result['joão']);
	array_push($series2['data'], (integer) $result['maria']);
	array_push($series3['data'], (integer) $result['neto']);
}

$final = array();

array_push($final, 'Primary Name');
array_push($final, $series1);
array_push($final, $series2);
array_push($final, $series3);

print json_encode($final);
?>

## Grafpie
/*Create Table 'alunos'*/ Table

CREATE TABLE alunos (
  id int(11) NOT NULL AUTO_INCREMENT,
  nome varchar(100) DEFAULT NULL,
  nota int(11) DEFAULT NULL,
  PRIMARY KEY (id)
) ENGINE=InnoDB AUTO_INCREMENT=13 DEFAULT CHARSET=latin1;

/*Data for the table `alunos` */
insert  into alunos(id,nome,nota) values (1,'Joao',5);
insert  into alunos(id,nome,nota) values (2,'Maria',7);
insert  into alunos(id,nome,nota) values (3,'Neto',9);

/* Pie chart that will be used to display the data.*/

http://jsfiddle.net/gh/get/jquery/3.1.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/pie-basic/


## index.php
<!DOCTYPE HTML>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>Bar chart with data from MySQL using Highcharts</title>
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
		<script type="text/javascript">
                $(document).ready(function() {
			var options = {
	            chart: {
	                renderTo: 'container',
	                type: 'bar'
	            },
	            title: {
	                text: 'Projeto em Desenvolvimento',
	              x: -20 //center
	            },
	            subtitle: {
	                text: '',
	                x: -20
	            },
	            xAxis: {
	                categories: []
	            },
	            yAxis: {
	                min: 0,
	                title: {
	                    text: ''
	                },
	                labels: {
	                    overflow: 'justify'
	                }
	            },
	            tooltip: {
	                formatter: function() {
	                        return '<b>'+ this.series.name +'</b><br/>'+
	                        this.x +': '+ this.y;
	                }
	            },
	            legend: {
	                layout: 'center',
	                align: 'right',
	                verticalAlign: 'middle',

	                borderWidth: 0
	            },
                     credits: {
                    enabled: true,
                    text: 'Desenvolvido por: RenatoLazaro'
                    },
                          credits: {
                          enabled: false
                          },

	            plotOptions: {
	                bar: {
	                    dataLabels: {
	                        enabled: true
	                    }
	                }
	            },
	            series: []
	        }

	        $.getJSON("data.php", function(json) {
				options.xAxis.categories = json[0]['data'];
	        	options.series[0] = json[1];
	        	options.series[1] = json[2];
	        	options.series[2] = json[3];
		        chart = new Highcharts.Chart(options);
	        });
	    });
		</script>
	    <script src="http://code.highcharts.com/highcharts.js"></script>
        <script src="http://code.highcharts.com/modules/exporting.js"></script>
	</head>
	<body>
		<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
	</body>
</html>
	<?php
	$db = new mysqli('localhost', 'root', 'password', 'test');
	if ($db->connect_error)
	die('Connection failed: '.$db->connect_error);

	$query = 'SELECT * FROM `alunos`';
	$execute = $db->query($query);

	$series1 = array(
	'name' => 'João',
	'data' => array()
	);

	$series2 = array(
	'name' => 'Maria',
	'data' => array()
	);

	$series3 = array(
	'name' => 'Neto',
	'data' => array()
	);

	while ($result = $execute->fetch_assoc()) {
	array_push($series1['data'], (integer) $result['joão']);
	array_push($series2['data'], (integer) $result['maria']);
	array_push($series3['data'], (integer) $result['neto']);
	}

	$final = array();

	array_push($final, 'Primary Name');
	array_push($final, $series1);
	array_push($final, $series2);
	array_push($final, $series3);

	print json_encode($final);
	?>
	/Create Table 'alunos'/ Table

	CREATE TABLE alunos (
	id int(11) NOT NULL AUTO_INCREMENT,
	nome varchar(100) DEFAULT NULL,
	nota int(11) DEFAULT NULL,
	PRIMARY KEY (id)
	) ENGINE=InnoDB AUTO_INCREMENT=13 DEFAULT CHARSET=latin1;

	/Data for the table `alunos` /
	insert into alunos(id,nome,nota) values (1,'Joao',5);
	insert into alunos(id,nome,nota) values (2,'Maria',7);
	insert into alunos(id,nome,nota) values (3,'Neto',9);

	/* Pie chart that will be used to display the data.*/

	http://jsfiddle.net/gh/get/jquery/3.1.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/pie-basic/
	<!DOCTYPE HTML>
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>Bar chart with data from MySQL using Highcharts</title>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
	<script type="text/javascript">
	$(document).ready(function() {
	var options = {
	chart: {
	renderTo: 'container',
	type: 'bar'
	},
	title: {
	text: 'Projeto em Desenvolvimento',
	x: -20 //center
	},
	subtitle: {
	text: '',
	x: -20
	},
	xAxis: {
	categories: []
	},
	yAxis: {
	min: 0,
	title: {
	text: ''
	},
	labels: {
	overflow: 'justify'
	}
	},
	tooltip: {
	formatter: function() {
	return '<b>'+ this.series.name +'</b><br/>'+
	this.x +': '+ this.y;
	}
	},
	legend: {
	layout: 'center',
	align: 'right',
	verticalAlign: 'middle',

	borderWidth: 0
	},
	credits: {
	enabled: true,
	text: 'Desenvolvido por: RenatoLazaro'
	},
	credits: {
	enabled: false
	},

	plotOptions: {
	bar: {
	dataLabels: {
	enabled: true
	}
	}
	},
	series: []
	}

	$.getJSON("data.php", function(json) {
	options.xAxis.categories = json[0]['data'];
	options.series[0] = json[1];
	options.series[1] = json[2];
	options.series[2] = json[3];
	chart = new Highcharts.Chart(options);
	});
	});
	</script>
	<script src="http://code.highcharts.com/highcharts.js"></script>
	<script src="http://code.highcharts.com/modules/exporting.js"></script>
	</head>
	<body>
	<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
	</body>
	</html>