Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá a todos, ESTOU COM UM PROBLEMÃO e preciso muito da ajuda de vocês!! Faz duas semanas que estou pesquisando como fazer um gráfico e integra-lo ao meu banco de dados. Tentei de várias e várias formas porém não consegui. Preciso gerar um gráfico com a quantidade de viagens realizada por dia para os determinados locais "puma", "MA" e "diversos". Gostaria de utilizar o between também para definir o período da pesquisa.
Não tenho ideia de onde colocar as variáveis, ou se minha busca sql esta correta ME DA UM HELP, ficarei super grato
<form method="post" action="">
<label>Data incial:</label>
<input id="dataInicial" name="dataInicial" type="date" required="" >
<label>Data final:</label>
<input id="dataFinal" name="dataFinal" type="date" required="" >
<button id="enviar" name="enviar" class="btn btn-primary">Enviar </button>
</form>
<?php
$servidor = "localhost";
$usuario = "root";
$senha = "";
$dbname = "controlebaldeio";
//Criar a conexao
$conn = mysqli_connect($servidor, $usuario, $senha, $dbname);
if(!$conn){
die("Falha na conexao: " . mysqli_connect_error());
}else{
//echo "Conexao realizada com sucesso";
}
$dataInicial = $_POST['dataInicial'];
$dataFinal = $_POST['dataFinal'];
$result_usuario = "SELECT local, sum(quantidade) as quantidade FROM registro WHERE dataViagem BETWEEN '$dataInicial' AND '$dataFinal' GROUP BY local";
$resultado_usuario = mysqli_query($conn, $result_usuario);
while($row_usuarios = mysqli_fetch_assoc($resultado_usuario)){
$local = $row_usuarios['local'];
$quantidade = $row_usuarios['quantidade'];
$dataViagem = $row_usuarios['dataViagem'].;
}
?><!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Documento sem título</title>
</head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['line']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('number', 'Dia');
data.addColumn('number', 'PUMA');
data.addColumn('number', 'MA');
data.addColumn('number', 'DIVERSOS');
data.addRows([
[1, 37.8, 8, 41.8],
[2, 30.9, 69.5, 32.4],
[3, 25.4, 57, 25.7],
[4, 11.7, 18.8, 10.5],
[5, 11.9, 17.6, 10.4],
[6, 8.8, 13.6, 7.7],
[7, 7.6, 12.3, 9.6],
[8, 12.3, 29.2, 10.6],
[9, 16.9, 42.9, 14.8],
[10, 12.8, 30.9, 11.6],
[11, 5.3, 7.9, 4.7],
[12, 6.6, 8.4, 5.2],
[13, 4.8, 6.3, 3.6],
[14, 4.2, 6.2, 3.4]
]);
var options = {
chart: {
title: 'RELATÓRIO DE VIAGENS',
},
width: 900,
height: 500,
axes: {
x: {
0: {side: 'top'}
}
}
};
var chart = new google.charts.Line(document.getElementById('line_top_x'));
chart.draw(data, google.charts.Line.convertOptions(options));
}
</script>
<body>
<div id="line_top_x"></div>
</body>
</html>
>
7 minutos atrás, Vinicius Rangel disse:
Você tem que olhar a documentação do chart que utiliza..
qual lib de chart é essa? e qual gráfico está tentando montar de acordo com os seus exemplos?
Bom dia, olhei sim a documentação, porém não mostram como incluir ao banco de dados. O tipo do gráfico é o "Line". A foto anexada é como ele está sendo exibido (Coloquei as flechas apenas para melhor compreensão do mesmo), porém esses dados contidos nele são estáticos, o que eu preciso é ligar ao meu Banco de Dados.
Que bilbioteca dce gráficos é essa ? é o google charts ? Se for, não tem como 'trazer direto' do banco de dados, ou prepara a array e cospe um json ou printa individualmente, no seu caso, como é dinamico podendo alternar entre intervalos, você sempre vai precisar percorrer a array.
O processo no seu caso é:
Consulta -> Agrupa as Series por data -> separa os valores por elemento (PUMA,MA,Diversos) -> Devolve a construçao -> printa
Cola a estrutura e um exemplo de registro do seu BD na resposta.
PS: Eu particularmente não gosto dessa lib, ja tentou ver outras mais simples de manuesear como highcharts e fusioncharts?
>
8 minutos atrás, AnthraxisBR disse:
Que bilbioteca dce gráficos é essa ? é o google charts ? Se for, não tem como 'trazer direto' do banco de dados, ou prepara a array e cospe um json ou printa individualmente, no seu caso, como é dinamico podendo alternar entre intervalos, você sempre vai precisar percorrer a array.
O processo no seu caso é:
Consulta -> Agrupa as Series por data -> separa os valores por elemento (PUMA,MA,Diversos) -> Devolve a construçao -> printa
Cola a estrutura e um exemplo de registro do seu BD na resposta.
PS: Eu particularmente não gosto dessa lib, ja tentou ver outras mais simples de manuesear como highcharts e fusioncharts?
Bom dia, estou usando google charts sim (até porque ele é visualimente mais agradavel). Achei que seria um pouco mais fácil porém não é nada facil rsrs. Eu não consigo fazer aparecer o valor das minhas variáveis, preciso de um grafico que apareça as informações em linha, independente da Lib, porém não encontrei forma de fazer aparecer os valores. Segue abaixo a tabela do meu banco de dados.
=========================================================================================================
SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
SET time_zone = "+00:00";
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8mb4 */;controlebaldeio
--
-- --------------------------------------------------------
--
-- Estrutura da tabela registro
--
CREATE TABLE `registro` (
`idregistro` int(11) NOT NULL,
`login_idlogin` int(11) NOT NULL,
`cm_idcm` int(11) NOT NULL,
`dataViagem` date DEFAULT NULL,
`quantidade` varchar(10) NOT NULL,
`local` varchar(60) NOT NULL,
`hora` time NOT NULL,
`dataAtual` date DEFAULT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;registro
--
INSERT INTO registro (idregistro, login_idlogin, cm_idcm, dataViagem, quantidade, local, hora, dataAtual) VALUES
(58, 6, 24, '2017-09-13', '3', 'MA - Klabin - Telêmaco Borba', '01:23:00', '2017-09-13'),
(57, 6, 23, '2017-09-14', '3', 'Puma - Klabin - Ortigueira', '14:47:07', '2017-09-13'),
(56, 6, 24, '2017-09-12', '2', 'Diversos', '03:56:00', '2017-09-12'),
--
-- Indexes for dumped tables
--
--
-- Indexes for table registro
--
ALTER TABLE `registro`
ADD PRIMARY KEY (`idregistro`),
ADD KEY `registro_FKIndex1` (`login_idlogin`),
ADD KEY `registro_FKIndex2` (`cm_idcm`),
ADD KEY `IFK_Rel_01` (`login_idlogin`),
ADD KEY `IFK_Rel_02` (`cm_idcm`);registro
--
ALTER TABLE `registro`
MODIFY `idregistro` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=81;
/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
Você tem que olhar a documentação do chart que utiliza..
qual lib de chart é essa? e qual gráfico está tentando montar de acordo com os seus exemplos?