WIFI ESP8266 суточный график температуры и влажности

Постановка задачи

Представляем новый интересно-полезный проект с использованием WiFi-контроллера ESP8266. Построим график изменения двух физических величин во времени, используя только возможности самого контроллера, без задействования внешних веб-сайтов. В качестве подопытных физических величин возьмем температуру и влажность воздуха, которые будем измерять распространенным датчиком DHT22 AM2302. И для примера будем регистрировать данные только на протяжении суток с периодом в один час. Ещё одна из самых главных задач - пытаемся отказаться от часов реального времени, в пользу времени из интернета.

Используемая технология для построения графика

Данные будет собирать и хранить контроллер, а за отображение их графического вида возьмется ваш интернет-браузер и API под названием Google Charts. Данная API является продвинутой Java-библиотекой для отображения графиков на веб-страницах различных сайтов. В ней нам доступны для построения множество типов диаграм, трендов и графиков.

Для этого проекта мы возьмем только Line Chart.

Вам нужно понимать, что саму библиотеку не обязательно загружать себе на сайт или в контроллер ESP8266. Достаточно просто прописать синтаксис обращения к Google Charts в глобальном интернете и ваш браузер сам отобразит графику, согласно переданным данным и настройках для библиотеки на вашей веб-страничке или, как в нашем варианте в памяти контроллера.

Если вам интересно будет углубиться в возможности и настройки выбранной для этого проекта API, то документацию можно прогуглить по запросу Google Charts.

Схема подключения ESP8266 и DHT22

Схема не хитрая - плюс питания датчика DHT22 берем с вывода 3,3V контроллера, минус питания с вывода GND контроллера, а вывод данных датчика подключаем к D1 WiFi платы.

Программа контроллера ESP8266

Я программирую NodeMcu ESP8266 при помощи предварительно настроенного Arduino IDE соглано инструкции по ссылке.

Из дополнительных библиотек понадобится только DHT.h. Все остальное уже будет в наличии, включая библиотеку time.h для считывания времени с NTP сервера в интернете.

У вас должна быть настроена WiFi сеть с выходом в интернет. Её название и пароль необходимо ввести в соответствующие строки программы. Доступ в интернет нужен для получения временных меток с NTP сервера, а так же для получения вашим браузером библиотек Google Charts.

#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <time.h>
#include <DHT.h>

#define DHTPIN 5
//#define DHTTYPE           DHT11     // DHT 11 
#define DHTTYPE           DHT22     // DHT 22 (AM2302)
//#define DHTTYPE           DHT21     // DHT 21 (AM2301)
DHT dht(DHTPIN, DHTTYPE);

const char* ssid = "****";
const char* password = "****";
IPAddress ip(192,168,1,17);  //IP adres dlia prosmotra grafika web-brayzerom
IPAddress gateway(192,168,1,1);
IPAddress subnet(255,255,255,0);
ESP8266WebServer server(80);

const uint16_t lengt=24; //max kol tochek trenda
uint16_t tick=0;
time_t tnow[lengt];
float h[lengt], t[lengt];

void handleRoot() {
  String trendstr;
  
  trendstr = F("<html>\
  <head>\
    <script type='text/javascript' src='https://www.gstatic.com/charts/loader.js'></script>\
    <meta http-equiv='refresh' content='1000'/>\
    <title>Daily temperature</title>\
    <script type='text/javascript'>\
      google.charts.load('current', {'packages':['corechart']});\
      google.charts.setOnLoadCallback(drawChart);\
\
      function drawChart() {\
        var data = new google.visualization.DataTable();\
      data.addColumn('datetime', 'Time');\
      data.addColumn('number', 'Temp, C');\
      data.addColumn('number', 'Humidity, %');\
\
      data.addRows([");
  uint16_t k, y=0;
  for (int i=1; i <= lengt; i++){
    k = tick-1 + i;
    if (h[k]>0){
      if (y>0) trendstr += ",";
      y ++;
      if (k>lengt-1) k = k - lengt;
      trendstr += "[new Date(";
      trendstr += String(tnow[k]-(2*3600)); //2- chasovoy poyas
      trendstr += "*1000), ";
      trendstr += t[k];
      trendstr += ", ";
      trendstr += h[k];
      trendstr += "]";
    }
  }
    trendstr += F("]);\
\
        var options = {width: '100%',\
          title: 'GEEKMATIC.IN.UA',\
          curveType: 'function',\
          legend: { position: 'bottom' },\
          hAxis: {format: 'dd.MM.yyyy HH:mm',\
          gridlines: {\
            count: 10,\
          },\
        }\
        };\
\
        var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));\
        var formatter = new google.visualization.DateFormat({pattern: 'dd.MM.yyyy HH:mm'});\
        formatter.format(data, 0);\
        chart.draw(data, options);\
      }\
    </script>\
  </head>\
  <body>\
    <div id='curve_chart' style='width: 100%; height: 600px'></div>\
  </body>\
</html>");
  server.send ( 200, F("text/html"), trendstr );
}

const long interval = 3600000; //interval zapisi danih dlya trenda
unsigned long previousMillis = 0;

void setup(void){
  Serial.begin(9600);
  WiFi.begin(ssid, password);
  WiFi.config(ip, gateway, subnet);

  configTime(2*3600, 0, "pool.ntp.org", "time.nist.gov"); //NTP sayti dlia schitivaniya vremeni

  Serial.println("");
  // Wait for connection
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }
  Serial.println("");
  Serial.print("Connected to ");
  Serial.println(ssid);
  Serial.print("IP address: ");
  Serial.println(WiFi.localIP());
  server.on("/", handleRoot);
  server.begin();
  Serial.println("HTTP server started");
  dht.begin();
  delay(2000);
  tochka();
}
void loop(void){
  server.handleClient();
  
  unsigned long currentMillis = millis();
  if (currentMillis - previousMillis >= interval) {
    previousMillis = currentMillis;
    tochka();
  }
}

void tochka(){
  h[tick] = dht.readHumidity();
  t[tick] = dht.readTemperature();
  tnow[tick] = time(nullptr);
  Serial.print(String(ctime(&tnow[tick])));
  if (tick<lengt-1) tick ++; else tick = 0;
}

Результат

После подключения датчика и загрузки программы в контроллер, можно через браузер мобильного устройства или компьютера посмотреть на получившийся график температуры и влажности, сформированный платой NodeMcu ESP8266. Для этого в адресной строке браузера нужно ввести IP 192.168.1.17 и получим следующую картину. При этом контроллер должен быть подключен к той же WiFi-сети что и ваш браузер.

У меня датчик сутки пролежал на подоконнике. Температура не сильно менялась а влажность скакала.

Считаю, что устройство мега полезно в домашнем хозяйстве. Я в частности хочу установить такое на балконе для мониторинга комфортного хранения картошки в зимний период.

Предела для модификаций и совершенствования устройства построения суточного графика температуры на WiFi контроллере ESP я не вижу - можно использовать представленную программу как старт для множества крутых проектов.

<< Проекты << Все товары >> Статьи, уроки >>