{"id":638,"date":"2018-06-12T14:23:06","date_gmt":"2018-06-12T11:23:06","guid":{"rendered":"http:\/\/pavel.ceselsky.cz\/?page_id=638"},"modified":"2021-09-06T21:29:49","modified_gmt":"2021-09-06T18:29:49","slug":"weather","status":"publish","type":"page","link":"https:\/\/test.ceselsky.cz\/cs\/weather\/","title":{"rendered":"Po\u010das\u00ed"},"content":{"rendered":"<p>Na na\u0161em dom\u011b jsem naistaloval malou meteorologickou stanici vlasn\u00ed v\u00fdroby zalo\u017eenou na \u010dipech EPS8266 a DHT22.<\/p>\n\n\n\n<p>Tady se m\u016f\u017eete pod\u00edvat jak\u00e9 je u n\u00e1s po\u010das\u00ed!<\/p>\n\n\n\n<p><!DOCTYPE html>\r\n<html xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\" lang=\"en\" xml:lang=\"en\">\r\n  <head>\r\n    <title>P\u00e4iv\u00e4rinne weather<\/title>\r\n\t<meta content=\"text\/html; charset=UTF-8\" http-equiv=\"content-type\" \/>\r\n\r\n    <script src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.11.1\/jquery.min.js\"><\/script>\r\n    <script src=\"https:\/\/www.google.com\/jsapi\"><\/script>\r\n\r\n    <script>\r\n\r\n      function drawChart() {\r\n        var jsonData = $.ajax({\r\n          url: \"https:\/\/api.thingspeak.com\/channels\/62244\/feed.json?results=2000\",\r\n          dataType: \"json\",\r\n        }).done(function (results) {\r\n          var latest = results.feeds[results.feeds.length-1];\r\n\t\t  \r\n          var gauge1 = new google.visualization.Gauge($('#gauge1').get(0));\r\n          var gaugeData1 = google.visualization.arrayToDataTable([\r\n            ['Label', 'Value'],\r\n            ['Temp \u00b0C', 0]            \r\n          ]);\r\n          var options1 = {\r\n            width: 250,\r\n            redFrom: 30, redTo: 42,\r\n            greenFrom:-42, greenTo: -10, greenColor: '#0099ff',             \r\n            minorTicks: 5,\t\t\t\r\n\t\t\tmin:-42,\r\n\t\t\tmax:42\r\n          };\r\n\r\n          \/\/ For animation purpose only\r\n          gauge1.draw(gaugeData1,options1);\r\n\r\n          \/\/ Show real data\r\n          gaugeData1.setValue(0,1,parseFloat(latest.field1));          \r\n          gauge1.draw(gaugeData1,options1);\r\n\r\n\t\t  var gauge2 = new google.visualization.Gauge($('#gauge2').get(0));\r\n          var gaugeData2 = google.visualization.arrayToDataTable([\r\n            ['Label', 'Value'],\r\n            ['Humidity {9d60eeca03276c741f0fa954fa0062ae96fbf3cb4a7bc72d1dd0ddba0bd0836c}', 0]            \r\n          ]);\r\n          var options2 = {\r\n            width: 250,\r\n            redFrom: 90, redTo: 100,\r\n            yellowFrom:80, yellowTo: 90,\r\n            greenFrom:70, greenTo: 80,\r\n            minorTicks: 5\r\n          };\r\n\r\n          \/\/ For animation purpose only\r\n          gauge2.draw(gaugeData2,options2);\r\n\r\n          \/\/ Show real data\r\n          gaugeData2.setValue(0,1,parseFloat(latest.field2));          \r\n          gauge2.draw(gaugeData2,options2);\r\n\r\n          var data1 = new google.visualization.DataTable();\r\n\r\n          data1.addColumn('datetime', 'Time');\r\n          data1.addColumn('number', 'Temp');    \r\n\r\n          $.each(results.feeds, function (i, row) {\r\n            data1.addRow([\r\n              (new Date(row.created_at)),\r\n              parseFloat(row.field1)\r\n            ]);\r\n          });\r\n\r\n\t\t  var formatter0 = new google.visualization.DateFormat({pattern:'MMMM dd, yyyy, HH:mm:ss'});\r\n\t\t  formatter0.format(data1, 0);\r\n\r\n\t\t  var formatter1 = new google.visualization.NumberFormat({\r\n\t\t\tfractionDigits: 1,\r\n\t\t\tsuffix: '\u00b0C'\r\n\t\t\t});\r\n\t\t  formatter1.format(data1, 1);\r\n\t\t  \r\n          var chart1 = new google.visualization.LineChart($('#temperature').get(0));\r\n          chart1.draw(data1, {\r\n            title: 'Temperature history',\t\t\r\n\t\t\tlegend: { position: 'none' },\r\n\t\t\tcurveType: 'function'\t,\r\n\t\t\tvAxis: {format:'#.#\u00b0C'}, \r\n\t\t\thAxis: {format: 'MMM.dd HH:mm'},\r\n\t\t\tseries: [ {color: 'red', visibleInLegend: false} ]\t\t\t\r\n          });\r\n\r\n\t\t  var data2 = new google.visualization.DataTable();\r\n\r\n          data2.addColumn('datetime', 'Time');\r\n          data2.addColumn('number', 'Humidity');    \r\n\r\n          $.each(results.feeds, function (i, row) {\r\n            data2.addRow([\r\n              (new Date(row.created_at)),\r\n              parseFloat(row.field2)\r\n            ]);\r\n          });\r\n\r\n\t\t  var formatter2 = new google.visualization.NumberFormat({\r\n\t\t\tfractionDigits: 1,\r\n\t\t\tsuffix: '{9d60eeca03276c741f0fa954fa0062ae96fbf3cb4a7bc72d1dd0ddba0bd0836c}'\r\n\t\t\t});\r\n\t\t  formatter2.format(data2, 1);\r\n\t\t  \r\n\t\t  formatter0.format(data2, 0);\r\n\t\t  \r\n          var chart2 = new google.visualization.LineChart($('#humidity').get(0));\r\n          chart2.draw(data2, {\r\n            title: 'Humidity history',\r\n\t\t\tlegend: { position: 'none' },\r\n\t\t\tcurveType: 'function',\r\n\t\t\tseries: [ {color: 'blue', visibleInLegend: false} ],\r\n\t\t\tvAxis: { minValue: 0, maxValue:100, format:'#\\'{9d60eeca03276c741f0fa954fa0062ae96fbf3cb4a7bc72d1dd0ddba0bd0836c}\\''},\r\n\t\t\thAxis: {format: 'MMM.dd HH:mm'}\r\n          });\r\n\r\n        });\r\n      }\r\n\r\n      \/\/ load chart lib\r\n      google.load('visualization', '1', {\r\n        packages: ['corechart','gauge']\r\n      });\r\n\r\n      \/\/ call drawChart once google charts is loaded\r\n      google.setOnLoadCallback(drawChart);\r\n    <\/script>\r\n\r\n  <\/head>\r\n  <body>\r\n\t\r\n\t<div id=\"gaugeParent\" style=\"width:75{f0bfc397009334662553abdbff12732c1e2692ebce7f04f0c8aa9502145b496c}\">\r\n    <div id=\"gauge1\" style=\"width:250px;float:left; margin-left:25px;\"><\/div>\r\n\t<div id=\"gauge2\" style=\"width:250px;float:left; margin-right:25px;\"><\/div>\r\n\t<\/div>\r\n\t<div height=\"30\"><br><\/div>\r\n\t<div id=\"chartParent\" style=\"clear:both\">\r\n    <div id=\"temperature\" style=\"width: 100{f0bfc397009334662553abdbff12732c1e2692ebce7f04f0c8aa9502145b496c};\"><\/div>\r\n\t<div id=\"humidity\" style=\"width: 100{f0bfc397009334662553abdbff12732c1e2692ebce7f04f0c8aa9502145b496c};\"><\/div>\r\n\t<\/div>\r\n\t<div id=\"footer\" style=\"margin-top:50px\">\r\n\t<small>\r\n\tPowered by <a href=\"https:\/\/thingspeak.com\/channels\/62244\">Thingspeak<\/a> and <a href=\"https:\/\/developers.google.com\/chart\/\"> Google charts<\/a>.\r\n\t<\/small>\r\n\t<\/div>\r\n\t\r\n  <\/body>\r\n<\/html><\/p>","protected":false},"excerpt":{"rendered":"<p>I&#8217;ve installed a simple own-made weather station on our house. It is based on ESP8266 and DHT22. You can have a look what&#8217;s the weather like here! P\u00e4iv\u00e4rinne weather Powered by Thingspeak and Google charts.<\/p>","protected":false},"author":1,"featured_media":604,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"templates\/template-cover.php","meta":{"_uag_custom_page_level_css":"","ngg_post_thumbnail":0,"footnotes":""},"uagb_featured_image_src":{"full":["https:\/\/test.ceselsky.cz\/wp-content\/uploads\/2018\/06\/9023493219_7ec072d1ae_o.jpg",2000,1132,false],"thumbnail":["https:\/\/test.ceselsky.cz\/wp-content\/uploads\/2018\/06\/9023493219_7ec072d1ae_o-150x150.jpg",150,150,true],"medium":["https:\/\/test.ceselsky.cz\/wp-content\/uploads\/2018\/06\/9023493219_7ec072d1ae_o-300x170.jpg",300,170,true],"medium_large":["https:\/\/test.ceselsky.cz\/wp-content\/uploads\/2018\/06\/9023493219_7ec072d1ae_o-768x435.jpg",580,329,true],"large":["https:\/\/test.ceselsky.cz\/wp-content\/uploads\/2018\/06\/9023493219_7ec072d1ae_o-1024x580.jpg",580,329,true],"1536x1536":["https:\/\/test.ceselsky.cz\/wp-content\/uploads\/2018\/06\/9023493219_7ec072d1ae_o.jpg",1536,869,false],"2048x2048":["https:\/\/test.ceselsky.cz\/wp-content\/uploads\/2018\/06\/9023493219_7ec072d1ae_o.jpg",2000,1132,false],"trp-custom-language-flag":["https:\/\/test.ceselsky.cz\/wp-content\/uploads\/2018\/06\/9023493219_7ec072d1ae_o.jpg",18,10,false],"post-thumbnail":["https:\/\/test.ceselsky.cz\/wp-content\/uploads\/2018\/06\/9023493219_7ec072d1ae_o.jpg",1200,679,false],"twentytwenty-fullscreen":["https:\/\/test.ceselsky.cz\/wp-content\/uploads\/2018\/06\/9023493219_7ec072d1ae_o.jpg",1980,1121,false]},"uagb_author_info":{"display_name":"Pajka","author_link":"https:\/\/test.ceselsky.cz\/cs\/author\/pajka\/"},"uagb_comment_info":0,"uagb_excerpt":"I&#8217;ve installed a simple own-made weather station on our house. It is based on ESP8266 and DHT22. You can have a look what&#8217;s the weather like here! P\u00e4iv\u00e4rinne weather Powered by Thingspeak and Google charts.","_links":{"self":[{"href":"https:\/\/test.ceselsky.cz\/cs\/wp-json\/wp\/v2\/pages\/638"}],"collection":[{"href":"https:\/\/test.ceselsky.cz\/cs\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/test.ceselsky.cz\/cs\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/test.ceselsky.cz\/cs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/test.ceselsky.cz\/cs\/wp-json\/wp\/v2\/comments?post=638"}],"version-history":[{"count":1,"href":"https:\/\/test.ceselsky.cz\/cs\/wp-json\/wp\/v2\/pages\/638\/revisions"}],"predecessor-version":[{"id":1577,"href":"https:\/\/test.ceselsky.cz\/cs\/wp-json\/wp\/v2\/pages\/638\/revisions\/1577"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/test.ceselsky.cz\/cs\/wp-json\/wp\/v2\/media\/604"}],"wp:attachment":[{"href":"https:\/\/test.ceselsky.cz\/cs\/wp-json\/wp\/v2\/media?parent=638"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}