9 thoughts on “ESP8266 DHT11 Humidity Temperature Data logger”

1. Hello.
   I was very interested in this project.
   It is very useful with virtually no change to naku to show the capacitor charging constant.
   Inputs from DHT11 sensor.
   I have tested ESP8266 without any changes but I only use one ADC input because I want to test the charge of the capacitor.
   I can’t manage to add the START and STOP buttons on the page in the upper part to send 1 or 0 status to any GPIO which would activate the capacitor charging voltage to show charging or discharging characteristics.

   And my second request for help for the measurement to end after 20 readings because I don’t need more to make the chart last longer.
   As if it would work for me in student shows, I think to adapt the code to ESP32 to have more ADC inputs and to do current and voltage measurements with an electric power graph,
   Please help because I do not do this in the index.h html file.
   Sorry for my bad English .
   I’m writing from Poland.
   Greetings.
   Stan

   Log in to Reply

2. Hello,
   can anyone help me …? sorry for my english, i did my best to translate.
   I adapted the code proposed as an example for use with temp + humidity (SI7021) and I added a temp measure IR (MLX90614).

   in the .ino code I wrote:
   void handleADC() {
   int a = analogRead(A0)/100;

   humidity = sensor.readHumidity();
   temperature = sensor.readTemperature();
   tempIR01 = mlx.readObjectTempC();

   //Ref 1: https://circuits4you.com/2019/01/11/nodemcu-esp8266-arduino-json-parsing-example/
   //Ref 2: https://circuits4you.com/2019/01/25/arduino-how-to-put-quotation-marks-in-a-string/
   String data = “{\”ADC\”:\””+String(a)+”\”, \”Temperature\”:\””+ String(temperature) +”\”, \”Humidity\”:\””+ String(humidity)+”\”, \”Temp IR01\”:\””+ String(tempIR01)+”\”}”;

   digitalWrite(LED,!digitalRead(LED)); //Toggle LED on data request ajax
   server.send(200, “text/plain”, data); //Send ADC value, temperature and humidity JSON to client ajax request

   Serial.println(data);
   }

   The serial.printin gives the string of text with my four values:

   {“ADC”:”10″, “Temperature”:”30.59″, “Humidity”:”70.30″, “Temp IR01″:”30.85”}

   next, i added the lines in index.h for displays in addition to tempIR01 in curve and in the table but the tempIR01 curve is not displayed and it is written “undefined” instead of the value in the table.

   Thank you in advance if someone can help me because I’m not an expert I do not really see what’s wrong in the code.

   See after the complet code.ino and index.h
   **********
   code.ino :
   /*
   * ESP8266 NodeMCU DHT11 – Humidity Temperature Data logging Example
   * https://circuits4you.com
   *
   * Referances
   * https://circuits4you.com/2017/12/31/nodemcu-pinout/
   *
   */

   #include
   #include
   #include

   #include “index.h” //Our HTML webpage contents with javascripts
   #include
   #include

   #include “Adafruit_Si7021.h”
   Adafruit_Si7021 sensor = Adafruit_Si7021();

   Adafruit_MLX90614 mlx = Adafruit_MLX90614();

   #define LED 2 //On board LED

   //SSID and Password of your WiFi router

   const char* ssid = “ssid”;
   const char* password = “pw”;

   ESP8266WebServer server(80); //Server on port 80

   //===============================================================
   // This routine is executed when you open its IP in browser
   //===============================================================
   void handleRoot() {
   String s = MAIN_page; //Read HTML contents
   server.send(200, “text/html”, s); //Send web page
   }
   float humidity, temperature, tempIR01;

   void handleADC() {
   int a = analogRead(A0)/100;

   humidity = sensor.readHumidity();
   temperature = sensor.readTemperature();
   tempIR01 = mlx.readObjectTempC();

   //Ref 1: https://circuits4you.com/2019/01/11/nodemcu-esp8266-arduino-json-parsing-example/
   //Ref 2: https://circuits4you.com/2019/01/25/arduino-how-to-put-quotation-marks-in-a-string/
   String data = “{\”ADC\”:\””+String(a)+”\”, \”Temperature\”:\””+ String(temperature) +”\”, \”Humidity\”:\””+ String(humidity)+”\”, \”Temp IR01\”:\””+ String(tempIR01)+”\”}”;

   digitalWrite(LED,!digitalRead(LED)); //Toggle LED on data request ajax
   server.send(200, “text/plain”, data); //Send ADC value, temperature and humidity JSON to client ajax request

   Serial.println(data);
   }

   //==============================================================
   // SETUP
   //==============================================================
   void setup()
   {
   Serial.begin(115200);
   Serial.println();
   mlx.begin();

   WiFi.begin(ssid, password); //Connect to your WiFi router
   Serial.println(“”);

   //Onboard LED port Direction output
   pinMode(LED,OUTPUT);

   // Wait for connection
   while (WiFi.status() != WL_CONNECTED) {
   delay(500);
   Serial.print(“.”);
   }

   //If connection successful show IP address in serial monitor
   Serial.println(“”);
   Serial.print(“Connected to “);
   Serial.println(ssid);
   Serial.print(“IP address: “);
   Serial.println(WiFi.localIP()); //IP address assigned to your ESP

   server.on(“/”, handleRoot); //Which routine to handle at root location. This is display page
   server.on(“/readADC”, handleADC); //This page is called by java Script AJAX

   server.begin(); //Start server
   Serial.println(“HTTP server started”);
   }

   //==============================================================
   // LOOP
   //==============================================================
   void loop()
   {
   server.handleClient(); //Handle client requests
   /*char tempIR01[64];
   dtostrf(mlx.readAmbientTempC(), 2, 2, tempIR01);
   char T01[64];
   sprintf(T01, “Temp: %s”, tempIR01);
   Serial.println(T01);
   delay(1000);
   */
   }

   **********
   index.h :
   const char MAIN_page[] PROGMEM = R”=====(

   Line Chart | Circuits4you.com
   
   https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js

   canvas{
   -moz-user-select: none;
   -webkit-user-select: none;
   -ms-user-select: none;
   }

   /* Data Table Styling */
   #dataTable {
   font-family: “Trebuchet MS”, Arial, Helvetica, sans-serif;
   border-collapse: collapse;
   width: 100%;
   }

   #dataTable td, #dataTable th {
   border: 1px solid #ddd;
   padding: 8px;
   }

   #dataTable tr:nth-child(even){background-color: #f2f2f2;}

   #dataTable tr:hover {background-color: #ddd;}

   #dataTable th {
   padding-top: 12px;
   padding-bottom: 12px;
   text-align: left;
   background-color: #4CAF50;
   color: white;
   }

   Circuits4you.com
   Real Time Data Logging with Graphs on ESP8266

   Time
   ADC Value
   Temperaure (°C)
   Humidity (%)
   Temp IR01 (°C)

   //Graphs visit: https://www.chartjs.org
   var ADCvalues = [];
   var Tvalues = [];
   var Hvalues = [];
   var IR01val = [];
   var timeStamp = [];
   function showGraph()
   {
   var ctx = document.getElementById(“Chart”).getContext(‘2d’);
   var Chart2 = new Chart(ctx, {
   type: ‘line’,
   data: {
   labels: timeStamp, //Bottom Labeling
   datasets: [{
   label: “Voltage 1”,
   fill: false, //Try with true
   backgroundColor: ‘rgba( 243,18, 156 , 1)’, //Dot marker color
   borderColor: ‘rgba( 243, 18, 156 , 1)’, //Graph Line Color
   data: ADCvalues,
   },
   {
   label: “Temperature”,
   fill: false, //Try with true
   backgroundColor: ‘rgba( 243, 156, 18 , 1)’, //Dot marker color
   borderColor: ‘rgba( 243, 156, 18 , 1)’, //Graph Line Color
   data: Tvalues,
   },
   {
   label: “Humidity”,
   fill: false, //Try with true
   backgroundColor: ‘rgba(156, 18, 243 , 1)’, //Dot marker color
   borderColor: ‘rgba(156, 18, 243 , 1)’, //Graph Line Color
   data: Hvalues,
   },
   {
   label: “Temp IR01”,
   fill: false, //Try with true
   backgroundColor: ‘rgba(100, 18, 200 , 1)’, //Dot marker color
   borderColor: ‘rgba(100, 18, 200 , 1)’, //Graph Line Color
   data: IR01val,
   }
   ],
   },
   options: {
   title: {
   display: true,
   text: “Titre courbes”
   },
   maintainAspectRatio: false,
   elements: {
   line: {
   tension: 0.5 //Smoothening (Curved) of data lines
   }
   },
   scales: {
   yAxes: [{
   ticks: {
   beginAtZero:true
   }
   }]
   }
   }
   });

   }

   //On Page load show graphs
   window.onload = function() {
   console.log(new Date().toLocaleTimeString());
   };

   //Ajax script to get ADC voltage at every 5 Seconds
   //Read This tutorial https://circuits4you.com/2018/02/04/esp8266-ajax-update-part-of-web-page-without-refreshing/

   setInterval(function() {
   // Call a function repetatively with 5 Second interval
   getData();
   }, 2000); //5000mSeconds update rate

   function getData() {
   var xhttp = new XMLHttpRequest();
   xhttp.onreadystatechange = function() {
   if (this.readyState == 4 && this.status == 200) {
   //Push the data in array
   var time = new Date().toLocaleTimeString();
   var txt = this.responseText;
   var obj = JSON.parse(txt); //Ref: https://www.w3schools.com/js/js_json_parse.asp
   ADCvalues.push(obj.ADC);
   Tvalues.push(obj.Temperature);
   Hvalues.push(obj.Humidity);
   IR01val.push(obj.tempIR01);
   timeStamp.push(time);
   showGraph(); //Update Graphs
   //Update Data Table
   var table = document.getElementById(“dataTable”);
   var row = table.insertRow(1); //Add after headings
   var cell1 = row.insertCell(0);
   var cell2 = row.insertCell(1);
   var cell3 = row.insertCell(2);
   var cell4 = row.insertCell(3);
   var cell5 = row.insertCell(4);
   cell1.innerHTML = time;
   cell2.innerHTML = obj.ADC;
   cell3.innerHTML = obj.Temperature;
   cell4.innerHTML = obj.Humidity;
   cell5.innerHTML = obj.tempIR01;
   }
   };
   xhttp.open(“GET”, “readADC”, true); //Handle readADC server on ESP8266
   xhttp.send();
   }

   )=====”;

   Log in to Reply

   1. following the problem of copying / pasting code, here are the well-formatted codes:

      code.ino :
      [code]
      /*
      * ESP8266 NodeMCU DHT11 – Humidity Temperature + IR Data logging Example
      * https://circuits4you.com
      *
      * Referances
      * https://circuits4you.com/2017/12/31/nodemcu-pinout/
      *
      */

      #include
      #include
      #include

      #include “index.h” //Our HTML webpage contents with javascripts
      #include
      #include

      #include “Adafruit_Si7021.h”
      Adafruit_Si7021 sensor = Adafruit_Si7021();

      Adafruit_MLX90614 mlx = Adafruit_MLX90614();

      #define LED 2 //On board LED

      //SSID and Password of your WiFi router

      //const char* ssid = “jcw1”;
      //const char* password = “”;
      const char* ssid = “SFR_52C0”;
      const char* password = “ekfe4tcm83csyx7wbe63”;

      ESP8266WebServer server(80); //Server on port 80

      //===============================================================
      // This routine is executed when you open its IP in browser
      //===============================================================
      void handleRoot() {
      String s = MAIN_page; //Read HTML contents
      server.send(200, “text/html”, s); //Send web page
      }
      float humidity, temperature, tempIR01;

      void handleADC() {
      int a = analogRead(A0)/100;

      humidity = sensor.readHumidity();
      temperature = sensor.readTemperature();
      tempIR01 = mlx.readObjectTempC();

      //Ref 1: https://circuits4you.com/2019/01/11/nodemcu-esp8266-arduino-json-parsing-example/
      //Ref 2: https://circuits4you.com/2019/01/25/arduino-how-to-put-quotation-marks-in-a-string/
      String data = “{\”ADC\”:\””+String(a)+”\”, \”Temperature\”:\””+ String(temperature) +”\”, \”Humidity\”:\””+ String(humidity)+”\”, \”Temp IR01\”:\””+ String(tempIR01)+”\”}”;

      digitalWrite(LED,!digitalRead(LED)); //Toggle LED on data request ajax
      server.send(200, “text/plain”, data); //Send ADC value, temperature and humidity JSON to client ajax request

      Serial.println(data);
      }

      //==============================================================
      // SETUP
      //==============================================================
      void setup()
      {
      Serial.begin(115200);
      Serial.println();
      mlx.begin();

      WiFi.begin(ssid, password); //Connect to your WiFi router
      Serial.println(“”);

      //Onboard LED port Direction output
      pinMode(LED,OUTPUT);

      // Wait for connection
      while (WiFi.status() != WL_CONNECTED) {
      delay(500);
      Serial.print(“.”);
      }

      //If connection successful show IP address in serial monitor
      Serial.println(“”);
      Serial.print(“Connected to “);
      Serial.println(ssid);
      Serial.print(“IP address: “);
      Serial.println(WiFi.localIP()); //IP address assigned to your ESP

      server.on(“/”, handleRoot); //Which routine to handle at root location. This is display page
      server.on(“/readADC”, handleADC); //This page is called by java Script AJAX

      server.begin(); //Start server
      Serial.println(“HTTP server started”);
      }

      //==============================================================
      // LOOP
      //==============================================================
      void loop()
      {
      server.handleClient(); //Handle client requests
      /*char tempIR01[64];
      dtostrf(mlx.readAmbientTempC(), 2, 2, tempIR01);
      char T01[64];
      sprintf(T01, “Temp: %s”, tempIR01);
      Serial.println(T01);
      delay(1000);
      */
      }
      [/code]

      *********
      index.h :
      [code]
      const char MAIN_page[] PROGMEM = R”=====(

      Line Chart | Circuits4you.com
      
      https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js

      canvas{
      -moz-user-select: none;
      -webkit-user-select: none;
      -ms-user-select: none;
      }

      /* Data Table Styling */
      #dataTable {
      font-family: “Trebuchet MS”, Arial, Helvetica, sans-serif;
      border-collapse: collapse;
      width: 100%;
      }

      #dataTable td, #dataTable th {
      border: 1px solid #ddd;
      padding: 8px;
      }

      #dataTable tr:nth-child(even){background-color: #f2f2f2;}

      #dataTable tr:hover {background-color: #ddd;}

      #dataTable th {
      padding-top: 12px;
      padding-bottom: 12px;
      text-align: left;
      background-color: #4CAF50;
      color: white;
      }

      Circuits4you.com
      Real Time Data Logging with Graphs on ESP8266

      Time
      ADC Value
      Temperaure (°C)
      Humidity (%)
      Temp IR01 (°C)

      //Graphs visit: https://www.chartjs.org
      var ADCvalues = [];
      var Tvalues = [];
      var Hvalues = [];
      var IR01val = [];
      var timeStamp = [];
      function showGraph()
      {
      var ctx = document.getElementById(“Chart”).getContext(‘2d’);
      var Chart2 = new Chart(ctx, {
      type: ‘line’,
      data: {
      labels: timeStamp, //Bottom Labeling
      datasets: [{
      label: “Voltage 1”,
      fill: false, //Try with true
      backgroundColor: ‘rgba( 243,18, 156 , 1)’, //Dot marker color
      borderColor: ‘rgba( 243, 18, 156 , 1)’, //Graph Line Color
      data: ADCvalues,
      },
      {
      label: “Temperature”,
      fill: false, //Try with true
      backgroundColor: ‘rgba( 243, 156, 18 , 1)’, //Dot marker color
      borderColor: ‘rgba( 243, 156, 18 , 1)’, //Graph Line Color
      data: Tvalues,
      },
      {
      label: “Humidity”,
      fill: false, //Try with true
      backgroundColor: ‘rgba(156, 18, 243 , 1)’, //Dot marker color
      borderColor: ‘rgba(156, 18, 243 , 1)’, //Graph Line Color
      data: Hvalues,
      },
      {
      label: “Temp IR01”,
      fill: false, //Try with true
      backgroundColor: ‘rgba(100, 18, 200 , 1)’, //Dot marker color
      borderColor: ‘rgba(100, 18, 200 , 1)’, //Graph Line Color
      data: IR01val,
      }
      ],
      },
      options: {
      title: {
      display: true,
      text: “Titre courbes”
      },
      maintainAspectRatio: false,
      elements: {
      line: {
      tension: 0.5 //Smoothening (Curved) of data lines
      }
      },
      scales: {
      yAxes: [{
      ticks: {
      beginAtZero:true
      }
      }]
      }
      }
      });

      }

      //On Page load show graphs
      window.onload = function() {
      console.log(new Date().toLocaleTimeString());
      };

      //Ajax script to get ADC voltage at every 5 Seconds
      //Read This tutorial https://circuits4you.com/2018/02/04/esp8266-ajax-update-part-of-web-page-without-refreshing/

      setInterval(function() {
      // Call a function repetatively with 5 Second interval
      getData();
      }, 2000); //5000mSeconds update rate

      function getData() {
      var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
      //Push the data in array
      var time = new Date().toLocaleTimeString();
      var txt = this.responseText;
      var obj = JSON.parse(txt); //Ref: https://www.w3schools.com/js/js_json_parse.asp
      ADCvalues.push(obj.ADC);
      Tvalues.push(obj.Temperature);
      Hvalues.push(obj.Humidity);
      IR01val.push(obj.tempIR01);
      timeStamp.push(time);
      showGraph(); //Update Graphs
      //Update Data Table
      var table = document.getElementById(“dataTable”);
      var row = table.insertRow(1); //Add after headings
      var cell1 = row.insertCell(0);
      var cell2 = row.insertCell(1);
      var cell3 = row.insertCell(2);
      var cell4 = row.insertCell(3);
      var cell5 = row.insertCell(4);
      cell1.innerHTML = time;
      cell2.innerHTML = obj.ADC;
      cell3.innerHTML = obj.Temperature;
      cell4.innerHTML = obj.Humidity;
      cell5.innerHTML = obj.tempIR01;
      }
      };
      xhttp.open(“GET”, “readADC”, true); //Handle readADC server on ESP8266
      xhttp.send();
      }

      )=====”;
      [/code]

      Log in to Reply

      1. String(temperature) +”\”, \”Humidity\”:\””+ String(humidity)+”\”, \”Temp IR01\”:\””+ String(tempIR01)+”\”}”;

         Temp IR01 <<< Do not use space "TempIR01"

         Log in to Reply

3. hi, i Upload the code but Server not working after connection to wifi ,
   the serial monitor displays *WM: freeing allocated params! when i use wifimanager librairie

   Log in to Reply

   1. This is related to WiFiManager or Mixing of WiFiManager with my code is not done properly.

      Log in to Reply

4. Hi! I understood this. It is that I would like to know if it is possible to store a series of measures on my web page and read them off-line without using third parties. i.e. Excell sheets on Google or external clouds. Thank you! Claude

   Log in to Reply

5. It works perfectly. But I have a question. When I refresh the web page, the measurement starts again, losing the data. It would be possible for every “x” minutes to upload these acquired data and put them on my web page. Pure and graphical data. Thanks for your help. Thank you! Claude G.

   Log in to Reply

   1. Actually data is not stored anywhere its in browser only. Javascript updates webpage with incoming data and temporarily stores in browser, RAM.

      Log in to Reply