Slide 1
Slide 1 text
天気予報の情報を取得する話
2021年11月16日 (火)
IoT縛りの勉強会! IoTLT vol.81 @オンライン
豊田 陽介 ( @youtoy )
Slide 2
Slide 2 text
豊田陽介（@youtoy）
自己紹介
普段は、某通信会社勤務
自宅にたくさん
ガジェット好き
その他
IT系イベント主催、登壇や運営なども
子ども向けの活動いろいろ（IT系以外も）
プライベートでの活動 ビジュアルプログラミング・
IoTに関するコミュニティなど
Slide 3
Slide 3 text
余談
最近の取り組みの1つ
Slide 4
Slide 4 text
JavaScriptを使って
p5.js による 3D描画
＋
Anime.js によるイージング等
Slide 5
Slide 5 text
余談2
ヒーローズ・リーグへの
応募作品
Slide 6
Slide 6 text
前に作ったもののバージョン2
某アニメの悪役が使う禁呪法が
なんとあなたの手に！
Slide 7
Slide 7 text
今日の話題は
「天気予報情報の取得」
Slide 8
Slide 8 text
何を使う？
という話題が定期的に
出る気がする
（API廃止とかのタイミングで）
Slide 9
Slide 9 text
よく見かける気がするもの
Slide 10
Slide 10 text
そんな中、
今年の2月ごろに...
Slide 11
Slide 11 text
話題になってた「気象庁の情報の取得」
中の人からこんなツイートがされてた
Slide 12
Slide 12 text
気象庁の天気予報などの
情報が取得できる話
Slide 13
Slide 13 text
もう少し詳しく
Slide 14
Slide 14 text
Webサイトリニューアルが2/24に
Slide 15
Slide 15 text
そしてTwitter上にこのような話が
Slide 16
Slide 16 text
先ほどの2つ目のツイートのURL
天気予報（明後日まで・週
間）:https://www.jma.go.jp/bosai/forecast/data/forecast/130000.json
天気概況（明後日まで）：
https://www.jma.go.jp/bosai/forecast/data/overview_forecast/130000.json
天気概況（週間）
：https://www.jma.go.jp/bosai/forecast/data/overview_week/130000.json
Slide 17
Slide 17 text
先ほどの1つ目のURLをブラウザで開く
Slide 18
Slide 18 text
ユーザ登録や
APIキー等は不要
Slide 19
Slide 19 text
URLの数字の意味や取得された情報
天気予報（明後日まで・週
間）:https://www.jma.go.jp/bosai/forecast/data/forecast/130000.
json エリアに対応
Slide 20
Slide 20 text
エリアを指定する数字
https://www.jma.go.jp/bosai/common/const/area.json
一部抜粋
080000 水戸地方気象台
090000 宇都宮地方気象台
100000 前橋地方気象台
110000 熊谷地方気象台
120000 銚子地方気象台
130000 気象庁
140000 横浜地方気象台
190000 甲府地方気象台
200000 長野地方気象台
Slide 21
Slide 21 text
天気予報
3日分・週間
Slide 22
Slide 22 text
気象庁のサイト上
https://www.jma.go.jp/bosai/forecast/
#area_type=offices&area_code=130000
https://www.jma.go.jp/bosai/forecast/
#area_type=offices&area_code=110000
3日間の
天気
1週間の
天気
Slide 23
Slide 23 text
JavaScriptで取得して取り出し
Slide 24
Slide 24 text
取得した情報の中を検索してみたり
Slide 25
Slide 25 text
p5.jsのオンライン開発環境で取得
Slide 26
Slide 26 text
天気に応じた楽しい感じの
描画ができると良いかも
Slide 27
Slide 27 text
このあたりの話はQiitaの記事に
Slide 28
Slide 28 text
M5Stack系のデバイスを
使うと良いかなと思い
ググったら
Slide 29
Slide 29 text
いろいろ事例が
出てきたので
何かやってみたいな...
Slide 30
Slide 30 text
終わり！