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
64
ブラウザで AI・機械学習が扱える TensorFlow.js が使われているライブラリなどの話 / #さくらのAI Meetup vol.4「ブラウザ」
you
PRO
0
130
Blynk と Raspberry Pi Pico W で IoT 〜 MQTT・HTTPリクエストの組み合わせも 〜 / IoTLT vol.114
you
PRO
0
270
AIを活用したWebアプリのプロトタイプを作ってコンテストや展示に出してみた話 / 大阪工業大学 ネットワークデザイン学科 LT大会 2024v2
you
PRO
0
65
Babylon.jsと色々なものを組み合わせる:ブラウザのAPIやガジェットや2D描画ライブラリなど / Babylon.js 勉強会 vol.3
you
PRO
0
500
WebHID API で Joy-Con・DUALSHOCK 4 のセンサーをブラウザから利用する / IoTLT vol.109
you
PRO
0
240
UIFlow 2.0 で MQTT をやってみた! / IoTLT vol.108
you
PRO
0
2.6k
UIFlow 2.0 と ATOMS3 の組み合わせで LINE通知を試す / ビジュアルプログラミングIoTLT vol.16
you
PRO
0
460
技術コミュニティの中での生成AI(自身の観測範囲での事例について) / 23 Xmas Talk / 20231209
you
PRO
0
1.5k
Other Decks in Technology
See All in Technology
誰も全体を知らない ~ ロールの垣根を超えて引き上げる開発生産性 / Boosting Development Productivity Across Roles
kakehashi
2
240
ノーコードデータ分析ツールで体験する時系列データ分析超入門
negi111111
0
430
100 名超が参加した日経グループ横断の競技型 AWS 学習イベント「Nikkei Group AWS GameDay」の紹介/mediajaws202411
nikkei_engineer_recruiting
1
170
TypeScript、上達の瞬間
sadnessojisan
48
14k
型チェック 速度改善 奮闘記⌛
tocomi
1
140
Amplify Gen2 Deep Dive / バックエンドの型をいかにしてフロントエンドへ伝えるか #TSKaigi #TSKaigiKansai #AWSAmplifyJP
tacck
PRO
0
410
SDNという名のデータプレーンプログラミングの歴史
ebiken
PRO
2
170
リンクアンドモチベーション ソフトウェアエンジニア向け紹介資料 / Introduction to Link and Motivation for Software Engineers
lmi
4
300k
EventHub Startup CTO of the year 2024 ピッチ資料
eventhub
0
130
SRE×AIOpsを始めよう!GuardDutyによるお手軽脅威検出
amixedcolor
1
220
マルチプロダクトな開発組織で 「開発生産性」に向き合うために試みたこと / Improving Multi-Product Dev Productivity
sugamasao
1
310
開発生産性を上げながらビジネスも30倍成長させてきたチームの姿
kamina_zzz
2
1.7k
Featured
See All Featured
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
232
17k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Designing for Performance
lara
604
68k
YesSQL, Process and Tooling at Scale
rocio
169
14k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
27
840
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
The Power of CSS Pseudo Elements
geoffreycrofte
73
5.3k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
28
8.2k
jQuery: Nuts, Bolts and Bling
dougneiner
61
7.5k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
26
2.1k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
27
4.3k
Measuring & Analyzing Core Web Vitals
bluesmoon
4
140
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系のデバイスを 使うと良いかなと思い ググったら
いろいろ事例が 出てきたので 何かやってみたいな...
終わり!