Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
天気予報の情報を取得する話 / IoTLT vol.81
Search
you(@youtoy)
PRO
November 16, 2021
Technology
0
470
天気予報の情報を取得する話 / IoTLT vol.81
you(@youtoy)
PRO
November 16, 2021
Tweet
Share
More Decks by you(@youtoy)
See All by you(@youtoy)
"かわいい" がテーマのハッカソンでWebの技術を使って魔法の世界を作った話など / HTML5 10th Anniversary
you
PRO
0
54
ブラウザで AI・機械学習が扱える TensorFlow.js が使われているライブラリなどの話 / #さくらのAI Meetup vol.4「ブラウザ」
you
PRO
0
120
Blynk と Raspberry Pi Pico W で IoT 〜 MQTT・HTTPリクエストの組み合わせも 〜 / IoTLT vol.114
you
PRO
0
250
AIを活用したWebアプリのプロトタイプを作ってコンテストや展示に出してみた話 / 大阪工業大学 ネットワークデザイン学科 LT大会 2024v2
you
PRO
0
59
Babylon.jsと色々なものを組み合わせる:ブラウザのAPIやガジェットや2D描画ライブラリなど / Babylon.js 勉強会 vol.3
you
PRO
0
470
WebHID API で Joy-Con・DUALSHOCK 4 のセンサーをブラウザから利用する / IoTLT vol.109
you
PRO
0
220
UIFlow 2.0 で MQTT をやってみた! / IoTLT vol.108
you
PRO
0
2.5k
UIFlow 2.0 と ATOMS3 の組み合わせで LINE通知を試す / ビジュアルプログラミングIoTLT vol.16
you
PRO
0
440
技術コミュニティの中での生成AI(自身の観測範囲での事例について) / 23 Xmas Talk / 20231209
you
PRO
0
1.5k
Other Decks in Technology
See All in Technology
生成AIの強みと弱みを理解して、生成AIがもたらすパワーをプロダクトの価値へ繋げるために実践したこと / advance-ai-generating
cyberagentdevelopers
PRO
1
170
Figma Dev Modeで進化するデザインとエンジニアリングの協働 / figma-with-engineering
cyberagentdevelopers
PRO
1
420
Gradle: The Build System That Loves To Hate You
aurimas
2
140
アジャイルと契約 エッセンシャル版 / Agile Contracts Essential Edition
fkino
0
110
わたしとトラックポイント / TrackPoint tips
masahirokawahara
1
240
ExaDB-D dbaascli で出来ること
oracle4engineer
PRO
0
3.6k
フルカイテン株式会社 採用資料
fullkaiten
0
36k
チームを主語にしてみる / Making "Team" the Subject
ar_tama
4
300
AIを駆使したゲーム開発戦略: 新設AI組織の取り組み / sge-ai-strategy
cyberagentdevelopers
PRO
1
130
VPC間の接続方法を整理してみた #自治体クラウド勉強会
non97
1
570
AWS CDKでデータリストアの運用、どのように設計する?~Aurora・EFSの実践事例を紹介~/aws-cdk-data-restore-aurora-efs
mhrtech
4
610
「最高のチューニング」をしないために / hack@delta 24.10
fujiwara3
20
3.3k
Featured
See All Featured
10 Git Anti Patterns You Should be Aware of
lemiorhan
654
59k
Gamification - CAS2011
davidbonilla
80
5k
Designing the Hi-DPI Web
ddemaree
280
34k
Designing for Performance
lara
604
68k
Stop Working from a Prison Cell
hatefulcrawdad
267
20k
Building Applications with DynamoDB
mza
90
6.1k
YesSQL, Process and Tooling at Scale
rocio
167
14k
How GitHub (no longer) Works
holman
311
140k
StorybookのUI Testing Handbookを読んだ
zakiyama
26
5.2k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
159
15k
Statistics for Hackers
jakevdp
796
220k
The Power of CSS Pseudo Elements
geoffreycrofte
72
5.3k
Transcript
天気予報の情報を取得する話 2021年11月16日 (火) IoT縛りの勉強会! IoTLT vol.81 @オンライン 豊田 陽介 (
@youtoy )
豊田陽介(@youtoy) 自己紹介 普段は、某通信会社勤務 自宅にたくさん ガジェット好き その他 IT系イベント主催、登壇や運営なども 子ども向けの活動いろいろ(IT系以外も) プライベートでの活動 ビジュアルプログラミング・
IoTに関するコミュニティなど
余談 最近の取り組みの1つ
JavaScriptを使って p5.js による 3D描画 + Anime.js によるイージング等
余談2 ヒーローズ・リーグへの 応募作品
前に作ったもののバージョン2 某アニメの悪役が使う禁呪法が なんとあなたの手に!
今日の話題は 「天気予報情報の取得」
何を使う? という話題が定期的に 出る気がする (API廃止とかのタイミングで)
よく見かける気がするもの
そんな中、 今年の2月ごろに...
話題になってた「気象庁の情報の取得」 中の人からこんなツイートがされてた
気象庁の天気予報などの 情報が取得できる話
もう少し詳しく
Webサイトリニューアルが2/24に
そしてTwitter上にこのような話が
先ほどの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
先ほどの1つ目のURLをブラウザで開く
ユーザ登録や APIキー等は不要
URLの数字の意味や取得された情報 天気予報(明後日まで・週 間):https://www.jma.go.jp/bosai/forecast/data/forecast/130000. json エリアに対応
エリアを指定する数字 https://www.jma.go.jp/bosai/common/const/area.json 一部抜粋 080000 水戸地方気象台 090000 宇都宮地方気象台 100000 前橋地方気象台 110000
熊谷地方気象台 120000 銚子地方気象台 130000 気象庁 140000 横浜地方気象台 190000 甲府地方気象台 200000 長野地方気象台
天気予報 3日分・週間
気象庁のサイト上 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週間の 天気
JavaScriptで取得して取り出し
取得した情報の中を検索してみたり
p5.jsのオンライン開発環境で取得
天気に応じた楽しい感じの 描画ができると良いかも
このあたりの話はQiitaの記事に
M5Stack系のデバイスを 使うと良いかなと思い ググったら
いろいろ事例が 出てきたので 何かやってみたいな...
終わり!