Olá, este é meu primeiro post e a partir de hoje decidi compartilhar um pouco de conhecimento. Sobre meus posts eu realmente espero que tenha uma boa respostas dos leitores bem como a troca de informações nos comentários.
Este primeiro post é relacionado a PHP, MySQL, JSON e a ferramente do Google, o Google Chart. Para uma melhor compreensão do que estaremos fazendo e também para que o post não fique muito extenso, dividirei em partes.
Basicamente, a Google Chart API é uma ferramenta que permite a criação de imagens e gráficos para a web.
Atualmente estou desenvolvendo um projeto em PHP e decidi utilizar a ferramenta para criação dos gráficos dinamicamente.
Inicialmente algumas coisas foram bem difíceis de encontrar na internet. Então decidi, com base na documentação e alguns exemplos tentar desenvolver algo que eu possa utilizar quando precisar.
Os exemplos e links que utilizei como referência vou deixar disponível no final deste post.
Depois dessa apresentação, vamos ao que realmente interessa.
Basicamente, para criar um gráfico em pizza estaticamente, basta utilizar o código abaixo (exemplo):
<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Task');
data.addColumn('number', 'Hours per Day');
data.addRows([
['Work', 11],
['Eat', 2],
['Commute', 2],
['Watch TV', 2],
['Sleep', 7]
]);
var options = {
width: 450, height: 300,
title: 'My Daily Activities'
};
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="chart_div"></div>
</body>
</html>
Bom, aqui já dá para ter uma noção de como ficarão nossos gráficos dinâmicos em formato de pizza. A Google Chart API é interessante, pois passando as informações corretas você poderá montar qualquer tipo de gráfico.
Segue abaixo os links de exemplos e documentação que utilizei para todos os exemplos:
- Google Chart Tools – Chart Gallery – Pie Chart;
- Google Chart Tools – Chart Gallery – Code Playground;
- Google Groups – Google Chart with PHP and MYSQL;
- Google Chart Tools – Image Charts – Getting Started With Charts;
- Google Chart Tools – Chart Data – Connecting Your Database – Populating Data Using Server-Side Code;
- Crie gráficos de maneira rápida e fácil com o Google Chart Tools;
- Google Chart Tools – Google Visualization API Reference.
O próximo post mostrarei como utilizar a API com PHP e MySQL.
Abraço e até a próxima.