obniz:お天気取得 ちょっと改良
OpenWeatherMapのAPIを利用したお天気取得プログラムを作ってみましたが、それをちょっと改良。1分ごとに情報が更新されます。
<!-- HTML --> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <script src="https://obniz.io/js/jquery-3.2.1.min.js"></script> <script src="https://unpkg.com/obniz@3.3.0/obniz.js"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script> var tempMax; var tempMin; var weatherDesc; var city = "Tokyo,jp"; var httpObj = new XMLHttpRequest(); var cnt = 1; var hiduke=new Date(); var year = hiduke.getFullYear(); var month = hiduke.getMonth()+1; var week = hiduke.getDay(); var day = hiduke.getDate(); var yobi= new Array("Sun","Mon","Tue","Wed","Thr","Fri","Sat"); var obniz = new Obniz("<<your obniz ID>>"); obniz.onconnect = async function () { obniz.display.clear(); obniz.display.print(month+" - "+day+" / "+yobi[week]+" - "+getTime()); obniz.display.print("Weather : " + weatherDesc); obniz.display.print(tempMax + " / " + tempMin); obniz.display.print("Updated at " +getTime()); }; function getWeather(){ httpObj.open("GET", "http://api.openweathermap.org/data/2.5/forecast?q=Tokyo,JP&appid=<<your api KEY>>", true); httpObj.onload = function(){ var data = JSON.parse(this.responseText); var cityName = data.city.name; var tag = ""; var Kelv = 273.16; tag += "<p>" + cityName + "</p>"; tag += "<table>"; for(var i=0; i<1; i++){ tempMax = Math.floor((Number(data.list[i].main.temp_max) - Kelv) * 10)/10 + " Dg"; // 最高気温 tempMin = Math.floor((Number(data.list[i].main.temp_min) - Kelv) * 10)/10 + " Dg"; // 最低気温 weatherDesc = data.list[i].weather[0].main; var icon = "<img src='http://openweathermap.org/img/w/" + data.list[i].weather[0].icon + ".png'>"; // お天気アイコン tag += "<tr>"; tag += "<td>" + icon + "</td>"; tag += "<td>Max</td><td>" + tempMax + "</td>"; tag += "<td>Min</td><td>" + tempMin + "</td>"; tag += "</tr>"; } tag += "</table>"; cnt += 1; var result = document.getElementById("result"); result.innerHTML = tag; obniz.display.clear(); obniz.display.print(month+" - "+day+" / "+yobi[week]+" - "+getTime()); obniz.display.print("Weather : " + weatherDesc); obniz.display.print(tempMax + " / " + tempMin); obniz.display.print("Updated at " +getTime()); } httpObj.send(null); }; getWeather(); setInterval(async function() { getWeather(); console.log("Got Weather Information." + cnt); }, 1000 * 60 * 1); // every 1 min function getTime() { var nowTime = new Date(); var nowHour = (' ' + nowTime.getHours()).slice(-2); var nowMin = ('00' + nowTime.getMinutes()).slice(-2); return nowHour + ":" + nowMin; } </script> </head> <body> <h1>Weather Info</h1> <div id="result">Getting weather...</div> </body> <div id="obniz-debug"></div> <div id="report"> </div> <script> </script> </body> </html>