{"id":691,"date":"2015-07-14T06:23:17","date_gmt":"2015-07-14T13:23:17","guid":{"rendered":"http:\/\/internetofhomethings.com\/homethings\/?p=691"},"modified":"2015-09-23T06:13:25","modified_gmt":"2015-09-23T13:13:25","slug":"mobile-weather-sensors-using-esp8266","status":"publish","type":"post","link":"https:\/\/internetofhomethings.com\/homethings\/?p=691","title":{"rendered":"Mobile Weather Sensors Using ESP8266"},"content":{"rendered":"<p><a href=\"http:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/mtbike.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-705\" src=\"http:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/mtbike.jpg\" alt=\"mtbike\" width=\"784\" height=\"338\" srcset=\"https:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/mtbike.jpg 784w, https:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/mtbike-300x129.jpg 300w\" sizes=\"auto, (max-width: 784px) 100vw, 784px\" \/><\/a><\/p>\n<p>Mountain Biking in the local trails in my Southern California home has kept me both reasonably fit while maintaining a close\u00a0connection with nature. As you roll through many of the trails here, the\u00a0terrain varies significantly&#8230;from the darker shadows of the canyon floors to the wide-open\u00a0sun exposed ridge-top fire roads. And with these changes there are noticeable variations in the temperature and moisture in the air.<\/p>\n<p>So I got to thinking&#8230;<\/p>\n<p>Wouldn&#8217;t it be interesting to track these variations as the trail climbs up the mountain face and descends down the other side? Sure, there are gadgets available that do this kind of thing. Like tracking your position, speed, altitude and heart-rate. If you really look around, you might even find one that reports the temperature. Not cheap, but they are available.<\/p>\n<p>Hmmm&#8230; Let&#8217;s see, can we make a do-it-yourself alternate? A solution that is much cheaper than\u00a0the cost of a commercially bought product?<\/p>\n<p>This looked like a perfect task for the super low-cost ESP8266 and a few inexpensive sensors. Coupled with a data link to a smartphone, you got a mobile platform tailored to\u00a0track just\u00a0about anything. A system that can be tailored to your exact needs. All at a fraction of the cost of a commercially available product, if you can find one meeting the specifications you want.<\/p>\n<p>Here is what I came up with&#8230;<\/p>\n<p>My\u00a0initial design\u00a0simply collects data samples and saves them to a file on my Android SD Card. This file is then transferred to a PC for visual representation with excel. Later, I intend to add screens to the Android App to display the data on phone. But first, a data collection and storage system was needed.<\/p>\n<p>After thinking about how\u00a0I wanted to implement\u00a0these features, the project\u00a0was broken down into several phases. This post addresses phase 1. Yep, this project is &#8220;work-in-progress&#8221; and phase 1 is as far as I have gotten&#8230;so far. Check back to this blog soon for updates that cover the subsequent elements of this Application as they are developed. Once completed, the &#8220;phases&#8221; that following will be turned into links.<\/p>\n<p>&#8216;<\/p>\n<ul>\n<li>Phase 1: Mobile Data Collection<\/li>\n<li><a href=\"http:\/\/wp.me\/p5NRQ8-cf\" target=\"_blank\">Phase 2: Data Recorder<\/a><\/li>\n<li><a href=\"http:\/\/wp.me\/p5NRQ8-cx\" target=\"_blank\">Phase 3: Excel Data Visualizations<\/a><\/li>\n<li><a href=\"http:\/\/wp.me\/p5NRQ8-dk\" target=\"_blank\">Phase 4: Mobile App Gadgets<\/a><\/li>\n<li><a href=\"http:\/\/wp.me\/p5NRQ8-dY\" target=\"_blank\">Phase 5: Heart Rate Monitor<\/a><\/li>\n<\/ul>\n<h3 style=\"text-align: center;\"><strong>Phase 1: Mobile Data\u00a0Collection<\/strong><\/h3>\n<p>Okay, to get started, the scope of the data collection set needed to be defined.\u00a0First I made a list of the information\u00a0to collect. While subject to\u00a0change, initial\u00a0list includes:<\/p>\n<p style=\"text-align: center;\">[wptg_comparison_table id=&#8221;6&#8243;]<\/p>\n<h3 style=\"text-align: center;\"><strong>The Mobile Smartphone App<\/strong><\/h3>\n<p style=\"text-align: left;\">The smartphone App is obviously the heart of this project. In this first phase, it must gather data from 3 different sources. But that&#8217;s not the only thing to consider. Aside from the Smartphone App, the project also uses an external micro-controller. So the hardware and software design of the ESP8266 system also needs to be developed. But let&#8217;s start with the Smartphone App and it&#8217;s 3 sources of data.<\/p>\n<ol>\n<li style=\"text-align: left;\">Phone&#8217;s Internal GPS Sensor<\/li>\n<li style=\"text-align: left;\">ESP8266 Micro-controller<\/li>\n<li style=\"text-align: left;\">Garmin Heart Rate Monitor<\/li>\n<\/ol>\n<p>But how do we do it? What do\u00a0the hardware and software components look like to make this a reality?<\/p>\n<h4 style=\"text-align: center;\"><strong>GPS Data<\/strong><\/h4>\n<p>My first thought was to add a GPS sensor as an\u00a0ESP8266 sensor input. But then the obvious hit me&#8230; The Smartphone has a built-in GPS Sensor. Why not use it instead of added a redundant capability to the ESP8266 system?<\/p>\n<p>Thanks to the geolocation API included with HTML5, access to the Smartphone GPS data is easy. Starting with the\u00a0default\u00a0<a href=\"http:\/\/wp.me\/p5NRQ8-aH\" target=\"_blank\">Native Cordova Android App<\/a>, the App code (Javascript\/jQuery) needed to collect location information from the Phone&#8217;s GPS receiver is minimal.<\/p>\n<p>HTML to display the sensor data (simplified, styling excluded):<\/p>\n<pre>1. Temperature &lt;p id=\"tempBaro\"&gt;&lt;\/p&gt;\r\n2. Barometric Pressure&lt;p id=\"presBaro\"&gt;&lt;\/p&gt;\r\n3. Humidity&lt;p id=\"humidity\"&gt;&lt;\/p&gt;\r\n4. Speed&lt;p id=\"Speed\"&gt;&lt;\/p&gt;\r\n5. Altitude&lt;p id=\"Altitude\"&gt;&lt;\/p&gt;\r\n6. Heading&lt;p id=\"Heading\"&gt;&lt;\/p&gt;\r\n7. Latitude&lt;p id=\"Lat\"&gt;&lt;\/p&gt;\r\n8. Longitude&lt;p id=\"Lon\"&gt;&lt;\/p&gt;\r\n9. Heart Rate&lt;p id=\"HeartRate\"&gt;&lt;\/p&gt;\r\n10. GPS Timestamp&lt;p id=\"GpsTimestamp\"&gt;&lt;\/p&gt;\r\n11. ESP8266 Run-time&lt;p id=\"systime\"&gt;&lt;\/p&gt;\r\n12. ESP8266 Heap&lt;p id=\"sysheap\"&gt;&lt;\/p&gt;\r\n13. ESP8266 Iterations&lt;p id=\"sysloop\"&gt;&lt;\/p&gt;\r\nStatus:&lt;p id=\"msg\"&gt;Ok&lt;\/p&gt;<\/pre>\n<p>Javascript\/jQuery to collect and update the sensor data display:<\/p>\n<pre> options = {\r\n     enableHighAccuracy: true,\r\n     timeout: 1000,\r\n     maximumAge: 0\r\n };\r\n \r\n \/\/------------------------------------------\r\n \/\/ Functions triggered after page loaded\r\n \/\/------------------------------------------\r\n jQuery(window).load(function () {\r\n     navigator.geolocation.watchPosition(onSuccess, onError, options);\r\n });\r\n\r\n\u00a0\/\/------------------------------------------ \r\n \/\/ onSuccess Callback\r\n \/\/------------------------------------------\r\n function onSuccess(position) {\r\n     var latt = position.coords.latitude.toFixed(7).toString();\r\n     var long = position.coords.longitude.toFixed(7).toString();\r\n     $(\"#Lat\").html(latt.substring(0, 11));\r\n     $(\"#Lon\").html(long.substring(0, 12));\r\n     $(\"#Speed\").html(position.coords.speed);\r\n     $(\"#Altitude\").html(position.coords.altitude);\r\n     $(\"#Heading\").html(position.coords.heading);\r\n     $(\"#GpsTimestamp\").html(position.timestamp);\r\n     updateWeatherSensorData();\r\n }\r\n \/\/-----------------------------------------\r\n \/\/ onError Callback \r\n \/\/-----------------------------------------\r\n function onError(error) {\r\n     \/\/Do nothing (ignore data set) or display message here if an error occurs\r\n     var element = document.getElementById('msg');\r\n     element.innerHTML = 'Failed GPS monitor' + '&lt;br \/&gt;';\r\n }\r\n<\/pre>\n<p>&nbsp;<\/p>\n<p>The &#8220;options&#8221; structure sets the GPS configuration. The &#8220;enableHighAccuracy&#8221; field must be set to true. This tells the\u00a0geolocation API to use the phones GPS Sensor. If it is set to false, the API will use the 4G or WIFI connection to determine location. Believe me, you do not want that active, it is very slow. It also will not work on the trail when you are out of cell tower range. The timeout is set to 1 second, setting the maximum time to acquire a location from the GPS sensor. Finally, the maximumAge sets the time to use a cached value before acquiring a new location from the sensor. Setting this to zero forces a new acquisition every time a position change is detected.<\/p>\n<p>Once the Cordova web-based App page (index.html) has been loaded, the geolocation &#8220;watchPosition&#8221; callback is registered. Subsequently, every time the phones&#8217; GPS sensor detects a change in position, the &#8220;onSuccess&#8221; callback function is executed. The &#8220;onError&#8221; callback is run if an error is detected.<\/p>\n<pre>navigator.geolocation.watchPosition(onSuccess, onError, options);<\/pre>\n<p>You can do anything you want with the data in the &#8220;onSuccess&#8221; callback. This example simply displays the values on the App window by setting the html for the objects by id to the GPS Sensor measured value. As noted, the next phase of this project will log these values to an SD card file on the Smartphone.<\/p>\n<h4 style=\"text-align: center;\"><strong>ESP8266\u00a0Data<\/strong><\/h4>\n<p>The last line of the &#8220;onSuccess&#8221; callback executes the function &#8220;updateWeatherSensorData&#8221;.<\/p>\n<pre>\u00a0\/\/--------------------------------------------\r\n \/\/Update WeatherSensor Data\r\n \/\/--------------------------------------------\r\n function updateWeatherSensorData() {\r\n     requestURL = \"http:\/\/192.168.22.1:9703\/?request=GetSensors\";\r\n     if ( typeof updateWeatherSensorData.timeout == 'undefined' ) {\r\n         \/\/ It has not... perform the initialization\r\n         updateWeatherSensorData.timeout = 0;\r\n     }\r\n     \/\/Get Weather Sensor Value\r\n     $.ajax({\r\n         url: requestURL,\r\n         error: function(error){\r\n             if(updateWeatherSensorData.timeout++ &lt;10) {\r\n                 setTimeout(updateWeatherSensorData, 1000);\r\n             }\r\n             else {\r\n                 updateWeatherSensorData.timeout = 0;\r\n             }\r\n         },\r\n         success: function(thedata){\r\n             $(\"#tempBaro\").html(thedata.B_Temperature);\r\n             $(\"#presBaro\").html(thedata.B_Pressure);\r\n             $(\"#humidity\").html(thedata.DH_Humidity);\r\n             $(\"#systime\").html(thedata.SYS_Time);\r\n             $(\"#sysheap\").html(thedata.SYS_Heap);\r\n             $(\"#sysloop\").html(thedata.SYS_Loopcnt);\r\n             updateWeatherSensorData.timeout = 0;\r\n         },\r\n         timeout: 7000 \/\/ sets timeout to 7 seconds\r\n     });\r\n }<\/pre>\n<p>&nbsp;<\/p>\n<p>The\u00a0updateWeatherSensorData() function makes an AJAX request to the ESP8266 to return the current sensor values and status in JSON format. Just as with the GPS Sensor data, these values are simply used to set the\u00a0html for the applicable displayed objects by id.<\/p>\n<h4 style=\"text-align: center;\"><strong>Heart Rate Monitor\u00a0Data<\/strong><\/h4>\n<p>A placeholder\u00a0has been set in the code\u00a0to collect heart rate monitor sensor data. While I have used Apps that interface with an external heart rate monitor using ANT+ and therefore know\u00a0it\u00a0is possible, I have have not accessed this interface in my own App&#8230;yet. So, not to hold up the initial release of this project, the Heart Rate Monitor\u00a0data is planned to\u00a0be added in Phase 5 using the <a href=\"http:\/\/www.thisisant.com\/developer\/ant\/ant-in-android\/\" target=\"_blank\">ANT+ for Android API<\/a>.<\/p>\n<h4 style=\"text-align: center;\"><strong>ESP8266 Configuration<\/strong><\/h4>\n<p>The ESP8266 hardware interfaces to just two sensors for this initial design:<\/p>\n<ol>\n<li>BMP085 &#8211; Temperature and Pressure Sensors<\/li>\n<li>DHT22 \u00a0 \u00a0&#8211; Temperature and Humidity Sensors<\/li>\n<\/ol>\n<p>After many revisions from experience using the ESP8266, the hardware for Phase I of this project is configured as shown in the following\u00a0schematic:<\/p>\n<p><a href=\"http:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/ESP8266-mobile-schematic-Phase-2.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-757 size-large\" src=\"http:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/ESP8266-mobile-schematic-Phase-2-1024x573.jpg\" alt=\"ESP8266-mobile-schematic - Phase 2\" width=\"620\" height=\"347\" srcset=\"https:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/ESP8266-mobile-schematic-Phase-2-1024x573.jpg 1024w, https:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/ESP8266-mobile-schematic-Phase-2-300x168.jpg 300w\" sizes=\"auto, (max-width: 620px) 100vw, 620px\" \/><\/a><a href=\"http:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/ESP8266-mobile-schematic-resized.jpg\"><br \/>\n<\/a>The basic ESP8266 framework is shown on the left side of the schematic with the two sensors\u00a0on the right. Refer to the following posts for more information about the operation of this circuit:<\/p>\n<ul>\n<li><a href=\"http:\/\/wp.me\/p5NRQ8-5z\" target=\"_blank\">Porting Spark Core Weather Sensor IoT to ESP8266-12<\/a><\/li>\n<li><a href=\"http:\/\/wp.me\/p5NRQ8-9L\" target=\"_blank\">A cleaner ESP8266-12 Hardware Setup<\/a><\/li>\n<\/ul>\n<p>The ESP8266 code for this project is very straight-forward. It consists of a simple web server, with the module operating in access point (AP) mode. The SSID has a fixed value of &#8220;ESP8266N4&#8221; and responds to the hard-coded IP: 192.168.22.1 on port 9703. These, of course, can be set to any value or even configured at run-time through the serial or initial web server default value. However, this example sticks with the hard-coded values since this system will only be paired with a single Smartphone.<\/p>\n<p>The web server responds to a request for sensor values and status with a JSON string that can be easily parsed with an AJAX call.<\/p>\n<p>Request URL:<\/p>\n<pre>http:\/\/192.168.22.1:9703\/?request=GetSensors\r\n<\/pre>\n<p>&nbsp;<\/p>\n<p>JSON string returned:<\/p>\n<pre>{\r\n\"B_Pressure\":\"29.24\",\r\n\"B_Temperature\":\"79.34\",\r\n\"B_Altitude\":\"555.0\",\r\n\"DH_Humidity\":\"34.7\",\r\n\"DH_Temperature\":\"69.1\",\r\n\"SYS_Time\":\"38\",\r\n\"SYS_Heap\":\"32368\",\r\n\"SYS_Loopcnt\":\"10\",\r\n\"SYS_WifiStatus\":\"255\",\r\n\"SYS_WifiRecon\":\"0\",\r\n\"SYS_WifiMode\":\"2\"\r\n}<\/pre>\n<p>&nbsp;<\/p>\n<p>The code is based on the IoT_Demo example included in the EspressIf SDK. This project uses <a href=\"https:\/\/github.com\/esp8266\/esp8266-wiki\/tree\/master\/sdk\" target=\"_blank\">SDK Version 1.1.1<\/a>. The latest version as of this post (1.2.0) should also work but I have not tested it with my code yet.\u00a0 The ESP8266 source code for Phase I of this project is available on <a href=\"https:\/\/github.com\/internetofhomethings\/Phase-1-ESP8266-Web-Server-for-Mobile-Sensors\" target=\"_blank\">GitHub here<\/a>.<\/p>\n<h4 style=\"text-align: center;\"><strong>Mobile App Screen Display<\/strong><\/h4>\n<p>The current App GUI display for Phase I of this project exhibits\u00a013 values.<\/p>\n<p><a href=\"http:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/MobileSensors3.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-701\" src=\"http:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/MobileSensors3.jpg\" alt=\"Mobile Sensors \" width=\"270\" height=\"480\" srcset=\"https:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/MobileSensors3.jpg 270w, https:\/\/internetofhomethings.com\/homethings\/wp-content\/uploads\/2015\/07\/MobileSensors3-169x300.jpg 169w\" sizes=\"auto, (max-width: 270px) 100vw, 270px\" \/><\/a><\/p>\n<p style=\"text-align: left;\">\u00a0This GUI includes CSS styling which takes advantage of the responsiveness of\u00a0bootstrap. The source code for Phase I of this project is available on <a href=\"https:\/\/github.com\/internetofhomethings\/Phase-1-Android-App-for-Mobile-Sensors\" target=\"_blank\">GitHub here<\/a>.<\/p>\n<h4 style=\"text-align: center;\"><strong>Operation<\/strong><\/h4>\n<p>Once the ESP8266 schematic has been built and the SDK based code has been installed, the ESP8266 is ready. The Android Application\u00a0should also be installed on the target SmartPhone.<\/p>\n<p>First, power up the ESP8266 from a 5 VDC source. The schematic includes a 5V to 3.3V converter, so I typically use a USB wall source or portable battery. Then you go to the phones WIFI configuration screen and select the ESP8266, which has an SSID of &#8220;ESP8266N4&#8221; in this example. This will connect the SmartPhone to the ESP8266 so sensor data can be read on demand.<\/p>\n<p>Now start up the Android App. The data will update live, typically at a rate of at least once every second. Go ahead, walk around with the phone and observe the GPS Lat and Long values change. You can also put a finger\u00a0on the barometric pressure sensor and see a change in the temperature value reported on the display.<\/p>\n<h4 style=\"text-align: center;\"><strong>Conclusion<\/strong><\/h4>\n<p>We now have a working mobile application that collects sensor data and displays it on the smartphone screen. Using a USB battery with 5000 ma-hours or more, the system can easily move with you, secured in a backpack, fanny-pack or even in your pocket. Stay tuned for the next phase &#8211; Periodic logging of these data packets to a file; coming soon&#8230;<\/p>\n<p>One final note: While this example uses an Android phone, the Cordova platform used is largely platform independent. While I am not familiar with iOS development, it should be a relatively simple task to adapt this application to work with an iPhone with little or no change to the code.<\/p>\n<p>Hope you find this information useful&#8230;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Mountain Biking in the local trails in my Southern California home has kept me both reasonably fit while maintaining a close\u00a0connection with nature. As you roll through many of the &hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1,10,19],"tags":[48,66,47],"class_list":["post-691","post","type-post","status-publish","format-standard","hentry","category-alltheposts","category-esp8266","category-internet-of-things","tag-esp8266-on-the-go","tag-esp8266-wifi","tag-mobile-iot-sensors"],"_links":{"self":[{"href":"https:\/\/internetofhomethings.com\/homethings\/index.php?rest_route=\/wp\/v2\/posts\/691","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/internetofhomethings.com\/homethings\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/internetofhomethings.com\/homethings\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/internetofhomethings.com\/homethings\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/internetofhomethings.com\/homethings\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=691"}],"version-history":[{"count":52,"href":"https:\/\/internetofhomethings.com\/homethings\/index.php?rest_route=\/wp\/v2\/posts\/691\/revisions"}],"predecessor-version":[{"id":894,"href":"https:\/\/internetofhomethings.com\/homethings\/index.php?rest_route=\/wp\/v2\/posts\/691\/revisions\/894"}],"wp:attachment":[{"href":"https:\/\/internetofhomethings.com\/homethings\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=691"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/internetofhomethings.com\/homethings\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=691"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/internetofhomethings.com\/homethings\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=691"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}