google charts Grafico php com between

Eduardo Rocha Kmiecik · Setembro 18, 2017

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>

Vinicius Rangel · Setembro 18, 2017

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?

Eduardo Rocha Kmiecik · Setembro 18, 2017

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.

AnthraxisBR · Setembro 18, 2017

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?

Eduardo Rocha Kmiecik · Setembro 18, 2017

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 */;
--
-- Database: `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;
--
-- Extraindo dados da tabela `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`);
--
-- AUTO_INCREMENT for dumped tables
--
--
-- AUTO_INCREMENT for table `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 */;

Entrar

Arquivado

google charts Grafico php com between

Recommended Posts

Eduardo Rocha Kmiecik 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vinicius Rangel 208

Compartilhar este post

Link para o post

Compartilhar em outros sites

Eduardo Rocha Kmiecik 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

AnthraxisBR 56

Compartilhar este post

Link para o post

Compartilhar em outros sites

Eduardo Rocha Kmiecik 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Conexão mysql com outro domínio

[Resolvido] JavaScript - Exibir logo dentro da Tabela html

Javascript - Calcular Valores Monetário em Tempo Real

Conteúdo Similar

Este projeto é apoiado pelas empresas

Fóruns

Tempo Real

Informação importante