FUN YOU BLOG

雨なので、外の雨の様子をブラウザ上に再現してみた。

f:id:alfe1025:20140330092644p:plain

https://alfe.hp2.jp/funyou/rain/

外の雨の様子を 実測雨量をもとに、ブラウザ上にそれっぽく再現してみました。 ↑を開くと、寝屋川市駅の雨がそれっぽく再現されます。

以下詳細

##使ったもの rainyday.js(https://maroslaw.github.io/rainyday.js/)

Yahoo!の気象情報API (https://developer.yahoo.co.jp/webapi/map/openlocalplatform/v1/weather.html)

雨降ってるし、ブラウザ上に再現してみたら楽しいかなーとか思って作ってみました。

##BKCとか京都駅の雨も再現してみた せっかくなのでほかの地点でも使えるように設定してまして、 https://xxx/rain/?[lat],[lng]#[imgurl] で 設定地点と背景画像の変更が可能です。

たとえば、 https://alfe.hp2.jp/funyou/rain/?34.982419,135.964517#https://upload.wikimedia.org/wikipedia/commons/thumb/2/2c/Ritsumeikan-Univ-BKC-01.jpg/320px-Ritsumeikan-Univ-BKC-01.jpg
にアクセスすると、立命館BKCの雨がそれっぽく再現されたり

https://alfe.hp2.jp/funyou/rain/?34.985634,135.757771#https://upload.wikimedia.org/wikipedia/commons/c/c1/JR-Kyoto-Isetan-01.jpg にアクセスすると、京都駅の雨がそれっぽく再現されたりします。

##仕組み 仕組みとしては、緯度経度とYahoo!の気象情報APIから実測降雨量を取得して、 rainyday.jsで再現する。。。という感じです。

研究室に引きこもってるときとかに、雨の強さ確認するのに使おうかなーとか思ってます。