Balizadora Inteligente - PARTE 6

Fala pessoal!

Desculpe pelo atraso na postagem da ultima etapa do projeto Balizadora Inteligente. Estive envolvido em novo projetos nas ultimas semanas.

Essa ultima etapa, vai tratar da API do Google para gráficos, no endereço:

https://developers.google.com/chart/interactive/docs/gallery

Você encontra vários tipos de gráficos disponíveis, no nosso caso vamos utilizar um em Linha:

https://developers.google.com/chart/interactive/docs/gallery/linechart

Nessa pagina você encontra o código fonte para gerar o gráfico, assim como quais variáveis manipular para alterar parâmetros.

Para o nosso caso, onde as informações estão em um banco de dados, é necessario fazer a busca, para isso vamos utilizar uma pagina em PHP auxiliar:

smart_get_data.php

<?php
 $temperature = $_REQUEST['temperature'];
 $temperature = str_replace(',','.',$temperature);
 $T_painel = str_replace(',','.',$T_painel);
 $query = "SELECT count(*) as `num` FROM a6399975_data.smart_control;";

 $link = mysql_connect('mysql15.000webhost.com','a6399975_micro','******');
        mysql_set_charset('utf8',$link);
        mysql_select_db('a6399975_data');

 $handle = mysql_query($query);
 $linha = mysql_fetch_array($handle, MYSQL_ASSOC);
 $total_num = $linha["num"];
 $reg_num = 20;
 $limit = "";
 if($total_num > $reg_num)
 {
  $limit = "LIMIT ".($total_num - $reg_num).",".$total_num;
 }

 $query = "SELECT date_format(timestamp,'%Y-%m-%d %H:%i:00') as `timestamp`, temperature, 

umidade, T_painel, status FROM a6399975_data.smart_control ORDER BY timestamp ASC $limit;";

 $handle = mysql_query($query);
 
 $data = "['Data','Temperatura','Umidade','Tensao Painel','Status LED'],";

 while($linha = mysql_fetch_array($handle, MYSQL_ASSOC)){
  $data = $data."['".$linha["timestamp"]."',".$linha["temperature"].",".$linha["umidade"].",

".$linha["T_painel"].",".$linha["status"]."],";
 }
 
 mysql_close($link);

 echo $data;
?>

Essa pagina se encarrega de acessar o banco, coletar os dados e formatar da maneira que o API do Google utiliza para construir o gráfico, então nessa pagina vamos ter algo do tipo:

['Data','Temperatura','Umidade','Tensao Painel','Status LED'],['2016-07-28 13:44:00',36,26,0,0],['2016-07-28 14:15:00',33,27,0,0], ....

Feito isso, com os dados"mastigados", podemos adicionar o Chart a nossa pagina principal da aplicação IoT:

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load('visualization', '1', {packages: ['corechart']});
    </script>
    <script type="text/javascript">
      function drawVisualization() 
   { 
        var data = google.visualization.arrayToDataTable([<?php include("smart_get_data.php") ?>]);

        var options = 
  {
          title : 'Dados Balizadora Smart',
          vAxes: [{title: "Temperatura x Umidade x Tensao Painel x Status"}],
          hAxis: {title: "Data"},
          seriesType: "bars",
          series: {3: {type: "line",targetAxisIndex:1}}
        };

        var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
      google.setOnLoadCallback(drawVisualization);
    </script>

Perceba que no script acima, a variável data, busca as informações da pagina construída pelo script anterior.

No final, esse é o resultado:

Bom é isso, assim finalizamos o projeto. Essa ultima parte ficou mais corrida, se alguém se interessar e tiver alguma duvida pergunte nos comentários.

Balizadora Inteligente - PARTE 5

Nessa quinta etapa do projeto, vamos entrar em detalhes sobre a programação da parte WEB. Nesse momento é importante você ter um servidor, como exemplo 000webhost que é gratuito e oferece banco de dados.

Tomando como exemplo esse servidor gratuito, vamos criar nossas tabelas que iram receber os dados de temperatura, umidade etc. No 000webhost entre em Database > phpMyAdmin clique em Enter phpMyAdmin, uma segunda janela ira abrir, nessa janela vamos criar a tabela “smart_control”.

Para isso digite a seguinte estrutura e pressione OK:

-- Table structure for table `smart_control`

CREATE TABLE `smart_control` (

  `temperature` float NOT NULL,

  `umidade` float NOT NULL,

  `T_painel` float NOT NULL,

  `status` tinyint(1) NOT NULL,

  `timestamp` datetime NOT NULL,

  PRIMARY KEY (`timestamp`)

) ENGINE=MyISAM DEFAULT CHARSET=latin1 COLLATE=latin1_general_ci;

Feito isso você vai receber a mensagem de tabela criada:

Agora que os campos estão criados, precisamos criar uma interface em PHP para popular as informações no banco, visto que nesse servidor gratuito não temos acesso direto ao banco, como exemplo usando IP e Navicat. Temos acesso apenas pela pagina WEB.

A interface para inserir as informações “parser_smart.php” tem o seguinte código:

<?php

    $temperature = $_REQUEST['temperature'];

    $temperature = str_replace(',','.',$temperature);

    $umidade = $_REQUEST['umidade'];

    $T_painel = $_REQUEST['T_painel'];

    $T_painel = str_replace(',','.',$T_painel);

    $status = $_REQUEST['status'];

    $status = abs($status-=1);

    $query = "REPLACE INTO a6399975_data.smart_control(`timestamp`,`temperature`,`umidade`,`T_painel`,`status`) VALUES (NOW(),'$temperature','$umidade','$T_painel','$status');";

    $link = mysql_connect('mysql15.000webhost.com','SEU_BANCO','SENHA');

    mysql_set_charset('utf8',$link);

    mysql_select_db('SEU_BANCO`);

    mysql_query($query);

    mysql_close($link);?>

Isso faz com que, ao receber as informações da seguinte forma:

http://smart.microembarcado.vacau.com/parser_smart.php?temperature=XX.X&umidade=XX.X&T_painel=X.XX&status=X

Exemplo:

http://smart.microembarcado.vacau.com/parser_smart.php?temperature=25.4&umidade=40&T_painel=1.76&status=1

Assim o banco de dados criado anteriormente é populado com as informações passadas pelo link.

É isso, no próximo post vamos falar sobre o API do Google para gráficos, e como utilizar as informações no banco.

Balizadora Inteligente - PARTE 4

Chegamos a 4º etapa do projeto Balizadora Inteligente, se você perdeu algum post, sugiro fazer a leitura:

Balizadora Inteligente - PARTE 1

Balizadora Inteligente - PARTE 2

Balizadora Inteligente - PARTE 3

Nesse post vamos tornar nosso objeto inteligente, dando inicio a programação do modulo ESP8266 com NODEMCU, vale lembrar que para esse projeto vamos precisar dos seguintes pacotes:

Para gerar seu pacote customizado basta acessar: http://nodemcu-build.com/ 

Feito o pacote do NodeMCU é necessário gravar na sua placa ESP8266, no Windows podemos utilizar o nodemcu-flasher. É simples basta conectar sua placa no computador, e seguir o passo a passo: https://github.com/nodemcu/nodemcu-flasher

Com o firmware gravado, agora podemos escrever nosso software utilizando a linguagem LUA. Para conhecer mais sobre a linguagem acesse: https://www.lua.org/portugues.html

"Lua é inteiramente projetada, implementada e desenvolvida no Brasil, por uma equipe na PUC-Rio (Pontifícia Universidade Católica do Rio de Janeiro). Lua nasceu e cresceu no Tecgraf, o então Grupo de Tecnologia em Computação Gráfica da PUC-Rio. Atualmente, Lua é desenvolvida no laboratório LabLua do Departamento de Informática da PUC-Rio."

Para fazer a interface de comunicação entre o modulo e a linguagem LUA, assim como programação vamos utilizar o software ESPlorer. Com ele basta conectar via porta serial, assim é possível enviar comandos, assim como gramar seu script init.lua, que será executado sempre que o modulo for reiniciado automaticamente.

Falando em script, a ideia aqui foi criar uma conexão TCP com o meu servidor gratuito hospedado no 000webhost, então conectando no servidor smart.microembarcado.vacau.com utilizando porta 80, ao conectar executamos a função sendStatus(socket) que se encarrega de fazer a leitura dos dados e enviar para pagina parser_smart.php, que se encarrega de escrever as informações no banco de dados.

Não conseguimos acessar o banco de dados diretamente desse servidor gratuito, por isso é necessário utilizar uma pagina em PHP para se encarregar disso.

A pagina deve ser construída com as informações lidas pelo modulo:

http://smart.microembarcado.vacau.com/parser_smart.php?temperature=XX&umidade=XX&T_painel=XX&status=XX

1. tmr.alarm(0, 120000, 1, function() initSocketAndTransmitData() end)
3. function initSocketAndTransmitData()
4.     local socket = net.createConnection(net.TCP, 0)
5.     socket:connect(80, "smart.microembarcado.vacau.com")
7.     socket:on("connection", function(conn)
8.         print("Connected to microembarcado")
9.         sendStatus(socket)
10.     end)
12.     socket:on("receive", function(conn, message)
13.             node.dsleep(180*10000000)
14.             --node.dsleep(1000000)
15.     end)
16. end
18. function sendStatus(socket)
19.     status, temp, humi = dht.read(5)
20.     --if status == dht.OK then
21.          adc.force_init_mode(adc.INIT_ADC)
22.          valadc = adc.read(0)
23.          valadc = valadc * (5 / 1023)
24.          gpio.mode(6,gpio.INPUT, gpio.PULLUP)
25.          led = gpio.read(6)
26.     --end
27.    
28.     local php = "GET /parser_smart.php?temperature=" ..temp..
29.     "&umidade=" ..humi.. "&T_painel=" ..valadc.. "&status=" ..led..
30.     " HTTP/1.1\r\nHost: smart.microembarcado.vacau.com\r\n" ..
31.     "Connection: keep-alive\r\nAccept: */*\r\n\r\n"
32.     socket:send(php)
33. end

Esse script é muito simples, basicamente o que ele faz é tentar uma conexão no servidor, se a conexão for OK, faz a leitura dos dados (temperatura,umidade,tensão no painel solar...) encapsula todas informações, e envia utilizando a pagina parser_smart.php, logo apos o modulo dorme por 30 minutos para economia de energia, repetindo isso ciclicamente.

No próximo post vamos continuar falando sobre a programação do modulo ESP8266, e sobre o servidor WEB com banco de dados e paginas PHP.