これでインターネットにあるサービスを活用できるな。
今回は天気情報を提供しているサイトからJSON形式データを
取得してM5StickC Plusの画面に表示してみよう。

今回使用するマイコンはこちら!
画面付きで小型のマイコンです。旧版のM5StickCから、ディスプレイサイズ、バッテリ容量が変更になっています。ブザーも実装されました。通信(WiFi/Bluetooth)機能、6軸加速度センサーも搭載されています。
Aruduino で開発できます。Amazonで確認
旧版との違いを意識してまとめて行きます。
これからはじめる方にお勧めの参考図書はこちら!
「OpenWeather」って何?
OpenWeatherは、気象データの操作をより簡単にする、認知度の高い気象製品を提供しています。
メリットとしては、次のように紹介されています。
私たちは24時間体制で何百万もの開発者と協力しており、これらのメリットは、複雑なエンタープライズシステムに至るまで、ほとんどのアプリケーションに適していると考えています。
すぐに使える気象製品のスペクトル
短期および長期の予測、歴史および観察
地球上の任意の場所
透明性のある価格設定とライセンス
当社の気象製品は、業界標準に準拠し、さまざまな種類のエンタープライズシステムと互換性のある高速で信頼性の高いAPIを介してアクセスできます。当社のすべての製品は、あらゆる場所に不可欠な気候変数を含んでいます。それに加えて、気象条件の影響を受ける産業に役立ついくつかの特別な製品があります。それらの中には、道路リスクと全国気象警報があります。
ー引用ー(https://openweathermap.org/guide)
簡単に言うと、「さまざまなシステムで利用できるように気象情報を提供するAPIを提供していますよ~」という感じです。
「API」とは、「Application Programming Interface」の頭文字です。簡単に言うと、「アプリケーションをプログラミングするためのインターフェース」です。インターフェイスとは、コンピュータ用語でいうと、「何か」と「何か」をつなぐものという意味を持ちます。ですので、プログラムとアプリケーション(ソフトウェア)をつなぐものを意味します。
今回使うOpenWeatherのAPIは、プログラムからOpenWeatherサービスに問い合わせを行いデータ取得をするインターフェイスとなります。
OpenWeatherを使う
では、「OpenWeather」を使ってみましょう。
以下にOpenWeatherのサイトへのリンクを張っておきます。こちらからアクセスしてください。

APIキーを取得する
APIを利用するためには、APIキーというものを発行する必要があります。
アカウントの作成
- サイトの右上にある「Sign In」をクリックして、サインイン画面上で「Create an Account」をクリックします。
-
UserName、Emailアドレス、パスワードを入力し、年齢確認などチェックしたら「Create Account」をクリックします。
-
設定したEmailアドレスにメールが来るので有効化します。
APIキーの取得
- 「Sign In」をクリックして、作成したユーザーでログインします。
- 「API Keys」をクリックすると画面にKeyが表示されますので、赤線の部分をコピーします。
東京の天気を取得してみる
取得したAPIキーを使用して、東京の現在の天気を取得してみます。
東京の緯度(lat:35.6828387)と経度(lon:139.7594549)を指定して天気を取得します。
1現在の天気を取得するためのAPIコマンドを作ります。
https://api.openweathermap.org/data/2.5/weather?lat=35.6828387&lon=139.7594549&units=metric&lang=ja&appid={API Key}
2ブラウザ(ChromeやEdgeなど)を開き、先ほど作ったAPIコマンドをURL入力部分に入力し、Enterキーを押します。
3以下のようなJSON形式データが返ってくれば成功です。
(天気なので、毎回データは変わります)
取得したJSON形式データを見てみる
データの特徴
- 次の赤字:気象条件によりデータがない場合がある
- 時刻はUTC基準の時刻になる
- 温度はデフォルトではケルビン(0K=-273.15℃)で計算する
※リクエストに&units=metricを追加することで摂氏(℃)で取得することが可能
(例:294.47Kの場合、294.47-273.15=21.32℃) - リクエストに&lang=jaを追加することで、天気説明などが日本語化される
※マイコン側で確保するメモリは、気象条件や地点によるデータ値の変動と、赤字部分の要素増減を含めて考慮する必要があります。
データの詳細説明
要素名 | 値 | 説明 |
coord | “lon”:139.7595, “lat”:35.6828 |
経度 緯度 |
weather | “id”:803, “main”:”Clouds”, “description”:”曇りがち”, “icon”:”04d” |
気象条件ID 気象パラメータのグループ(雨、雪、極端など) 指定言語による説明 天気アイコンのID |
base | “stations” | 内部パラメータ |
main | “temp”:14.95, “feels_like”:14.8, “temp_min”:13.84, “temp_max”:15.98, “pressure”:1019, “humidity”:47 “sea_level”: “grnd_level”: |
温度(単位:摂氏℃) 体感温度(単位:摂氏℃) 温度:最低(単位:摂氏℃) 温度:最高(単位:摂氏℃) 大気圧(単位:hPa) 湿度(%) 海面の大気圧(単位:hPa) 地上の大気圧(単位:hPa) |
visibility | 10000 | 視界(最大10㎞) |
wind | “speed”:3.09, “deg”:140 ”wind.gust”: |
風速(単位:m/s) 風向(度) 突風(単位m/s) |
clouds | “all”:75 | 曇り(単位%) |
rain | “rain.1h” “rain.3h” |
降雨量(過去1時間当たり)(単位㎜) 降雨量(過去3時間当たり)(単位㎜) |
snow | “snow.1h” “snow.3h” |
降雪量(過去1時間当たり)(単位㎜) 降雪量(過去3時間当たり)(単位㎜) |
dt | 1652243110 | データ計算時刻:UNIX(UTC) |
sys | “type”:1, “id”:8077, “message”: “country”:”JP”, “sunrise”:1652211585, “sunset”:1652261701 |
内部パラメータ 内部パラメータ 内部パラメータ 国コード(JPは日本) 日の出時刻:UNIX(UTC) 日の入り時刻:UNIX(UTC) |
timezone | 32400, | UTCから秒単位でシフトする ※日本時間(+9時間)を秒に直すと32400s |
id | 1861060 | 都市ID |
name | “日本” | 国名か都市名 |
cod | 200 | 内部パラメータ |
JSONを扱う際のメモリサイズを計算する
取得したJSON形式データを扱うためのメモリサイズを計算します。
計算には、過去記事でご紹介したArduinoのAssistantを使います。
メモリの計算方法は、次の記事で紹介しています。
すけろく Pythonなどでは、JSONでデータを扱っていたが、 Arduino IDEで扱うことはできるのか? げんろく それなら「ArduinoJSON」ライブラリがあるぞ! 取り扱うデータで使[…]
計算した結果、1024が妥当な感じですが、今回は倍の「2048」を、Arduino IDEで指定し、メモリを確保します。
M5StickC Plusで現在の天気を表示してみよう
それでは、実際にプログラミングしてみましょう。
前述した、OpenWeatherにhttpsリクエストを発行し、JSON形式のデータを取得、JSONデータから天気情報を取得して、M5StickC Plusのディスプレイに表示させてみます。
Wi-Fi接続用のSSIDとパスワードをM5StickC Plusに設定する
Wi-Fi環境への接続が必要になります。今回のプログラムでは、事前にM5StickC Plusに記憶させた情報を使用しています。
Wi-Fi接続情報の保存と読み出し方法は、次の記事で紹介しています。
この記事では、Arduino IDEを使ってコンピュータをWi-Fiルータに接続する方法について紹介します。 Wi-Fi接続する方法は、2つあります。2回目の今回はマイコンにアクセスポイント情報(SSID、パスワード)を記憶させることでプ[…]
OpenWeatherのルート証明書を取得する
OpenWeatherへのリクエストはhttpsなのでルート証明書をプログラム内に含める必要があります。
ルート証明書の取得方法は、次の記事で紹介しています。
すけろく 普段、何気なくブラウザでインターネットサイトを 見ているが、URLの最初のHttpsとはなんだ? げんろく httpsはHttpの通信を暗号化して行うものだ。 ちょっと違いを押さえてみるか[…]
ライブラリを追加する
今回使うライブラリ「ArduinoJSON」をインストールします。
※プログラムを実行した際の「ArduinoJSON」のバージョンは「6.19.4」です。
ライブラリのインストールは、次の記事で紹介しています。
Arduino IDE」では、使用する機能やセンサー、ボードを使用するプログラムで使用できる有効なライブラリが公開されています。ライブラリを使用すると、効率的かつ品質を確保したプログラミングが可能です。 ここでは、Ardu[…]
現在の天気情報表示プログラム
Arduino IDEを起動して、「ファイル」メニューから「新規ファイル」を選択し、表示されるスケッチに以下のように記述します。
※「OpenWeatherのAPIキー」、「OpenWeatherのルート証明書」は、ご自分の環境に合わせて値を修正してください。(スケッチ例では、「”Please correct it to the value that suits your environment.”」と記載しています。)
Arduino IDE スケッチ例
M5StickC Plusへの書き込み
- 「ファイル」メニューから「名前を付けて保存」で任意の名前を付けて保存します。
- 「ツール」メニューから「ボード」情報を確認し、M5StickC Plusであるか確認します。
この際、「シリアルポート」にマイコンを接続したCOMポートが指定されているかも確認します。 - 「ツール」メニューから「Patition Scheme」を「”No OTA(Large APP)”」にします。
※ここを変更しないと、スケッチが大きいというエラーになります。 - 「ツール」メニューから「シリアルモニタ」を選択してシリアルモニタを起動します。
- 「スケッチ」メニューから「マイコンボードに書き込む」を選択します。
プログラム実行結果
M5StickC Plusのディスプレイに以下のとおり表示されれば成功です。
さて、これでインターネットから天気情報を取得してディスプレイに表示することができました。
今後は、取得したデータをいろいろディスプレイで表現してみようか、検討中です。
今回の記事は以上になります。
最後までご覧いただきありがとうございました。
今回使用するマイコンはこちら!
画面付きで小型のマイコンです。旧版のM5StickCから、ディスプレイサイズ、バッテリ容量が変更になっています。ブザーも実装されました。通信(WiFi/Bluetooth)機能、6軸加速度センサーも搭載されています。
Aruduino で開発できます。Amazonで確認
旧版との違いを意識してまとめて行きます。
これからはじめる方にお勧めの参考図書はこちら!
アイデアをカタチにする! M5Stack入門&実践ガイド | M5Stack&M5StickCではじめるIoT入門 | みんなのM5Stack入門 | ESP32&Arduino 電子工作 プログラミング入門 | みんなのArduino入門 |
確認する | 確認する | 確認する | 確認する | 確認する |