Fala Galera blz!?
Estou tentando desenvolver uma pagina com gráficos do Google que busca as informações no banco de dados , também aproveitando para pratica Orientação a Objetos .
Fiz algumas pesquisas e encontrei esse post https://rubsphp.blogspot.com/2013/05/gerar-graficos-em-php-com-o-google-charts.html
Que por sinal bem escrito e explicado, testei os códigos do mesmo e 'Ok' tudo funcionando certinho como no Blog
A minha duvida seria como eu faço para desenvolver o mesmo resultado usando OO ?
Fiz alguns teste e o mais próximo que cheguei foi com os seguintes códigos abaixo
index.php
Aqui ao invés de passar uma URL para função ajax eu passei um metodo static que faz a conexão e trata os valores para json
<?php require_once 'global.php' ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>Exemplo de gráfico</title>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
google.load('visualization', '1.0', {'packages':['corechart']});
google.setOnLoadCallback(desenhar);
function desenhar(){
var json_text = $.ajax({url: "'.<?php Alarme::buscar() ?>.'", dataType:"json", async: false}).responseText;
;
var json = eval("(" + json_text + ")");
var dados = new google.visualization.DataTable(json.dados);
var chart = new google.visualization.BarChart(document.getElementById('area_grafico'));
chart.draw(dados, json.config);
}
</script>
</head>
<body>
<div id="area_grafico"></div>
</body>
</html>
Alarme.php
<?php
class Alarme {
public static function buscar()
{
$grafico = array(
'dados' => array(
'cols' => array(
array('type' => 'string', 'label' => 'CIDADE'),
array('type' => 'number', 'label' => 'Qtd')
),
'rows' => array()
),
'config' => array(
'title' => 'Cidades',
'width' => 400,
'height' => 300
)
);
$query = "select CIDADE,count(CIDADE) as Qtd from alarmes group by CIDADE having count(CIDADE) >= 2 order by count(CIDADE) desc";
$conexao = Conexao::pegarConexao();
$stmt = $conexao->query($query);
while ($obj = $stmt->fetchObject()) {
$grafico['dados']['rows'][] = array('c' => array(
array('v' => $obj->CIDADE),
array('v' => (int)$obj->Qtd)
));
}
header('Content-Type: application/json; charset=UTF-8');
echo json_encode($grafico);
}
}
Quando eu fui testar a pagina retornou esse html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>Exemplo de gráfico</title>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
google.load('visualization', '1.0', {'packages':['corechart']});
google.setOnLoadCallback(desenhar);
function desenhar(){
var json_text = $.ajax({url:
"'.{"dados":{"cols":[{"type":"string","label":"CIDADE"},{"type":"number","label":"Qtd"}],"rows":[{"c":[{"v":"SAO PAULO"},{"v":3}]},{"c":[{"v":"SAO JOSE DO RIO PRETO"},{"v":2}]},{"c":[{"v":"SANTOS"},{"v":2}]}]},"config":{"title":"Cidades",
"width":400,"height":300}}.'", dataType:"json", async: false}).responseText;
;
var json = eval("(" + json_text + ")");
var dados = new google.visualization.DataTable(json.dados);
var chart = new google.visualization.BarChart(document.getElementById('area_grafico'));
chart.draw(dados, json.config);
}
</script>
</head>
<body>
<div id="area_grafico"></div>
</body>
</html>
Pasta projeto
pasta classes
Alarme.php
config.php
Conexao.php
Erro.php
global.php
index.php
Bom antes de mais nada queria dizer que estou aprendendo e praticando tanto o php, jquery/ajax, html ....
E pelo que eu entedi a função $ajax precisa do caminho até o arquivo com o método que faz a conexão e o select
Eu acredito que essa ideia de usar um metodo static não funciona ou não foi feito do jeito certo
Duvidas: Como eu faço para passar um caminho que execute esse metodo buscar()?
A ideia que tive de usar o metodo static faz algum sentido?
Bom desde ja agradeço a toda comunidade e a equipe da alura .
Abs