アウトプットは大事
雨が降っても基本傘はささないタイプなので雨はあまり気にしない
天気予報を取得して降水確率を表示する
気象庁のHPからJsonデータを取得して
M5StackCore2に表示したい
天気予報ではなく、降水確率を知りたい
今回も様々なページを参考にさせていただきました。
「UIFLOW JSON」とかで検索してね。
(M5Stackキーワードで調べちゃうと、ArudinoのほうがメインなのでUIFLOWで検索したほうがヒットしやすいことに気が付きました)
つまづきまくったスタート、デバッグも試行錯誤
Wifiを接続して、HTTPブロックでJson取得はできている。
参考ページの通りに作ってみたけど、表示されない。
ひとつづつ分解しながら確認していっています。
GetDataは内容がラベル表示されました。
変数JsonDataにGetDataを代入、ラベル表示させるとなにも表示されない。。
リストの空チェックブロックを追加したらFalseと表示されたので、中身は入っているということですね。。
UIFLOWでのデバッグの仕方もわからない
ラベルに表示させるにしても表示されなかったり失敗してしまう…もはや中身がわからないから解決のヒントが思いつかない。
(表示させる変数が違ったかもしれない。そういうケアレスミス多すぎ)
グラフィックのテキスト表示ブロックを使ってJSON形式に変換して変数の表示させると中身が確認できました。
リストとして取得できているデータを確認しながら、抽出、整形していきました。
問題解決、降水確率だけ表示できた
- リスト化
- リストの中から必要KeyのValueを抽出
を必要な項目にぶち当たるまで繰り返す。
VSCodeでJsonを一度表示させて、何番目のデータか確認しながらやるとはかどりました。
緑がリストの処理で、ピンクがマップで処理しているところ
紫の数値が降水確率なのですが。
気象庁の降水確率は以下の内容でした
- 当日、翌日が表示されている
- 6時間ごとの%
- すでに経過した時間帯はJsonから削除されていて、HTML上では”-”での表記
- %はMAXで8個、MINで5個
コード的にはよろしくないと思いますが、%をMAXの8個になるまで項目数を追加して
当日分だけの4個になるよう後ろから削除していくというループブロックを付けました。