河川水位情報を使い易くするスマホアプリの作成（１）

　最近の台風や低気圧による河川の氾濫などで被害を受けられた方々にお見舞い申し上げます。今後の水害をできるだけ抑えるために、（これまでほとんど気にとめていなかった）河川水位情報等も活用できるとよい思います。

　神奈川県内にも多数の河川があり、リアルタイム河川カメラ画像や水位グラフなどが提供されています。例えば、主にPC向けに図１のようなWebページがあります。多彩な情報が掲載されていて、有効に活用できそうです。ただ、思いついた時に直ぐにスマホでこれを利用しようとすると、以下に述べるような使いにくい点もあります。

　スマホで見るうえで問題となるのは、以下の点です。

• スマホ用に設計されていないので、文字などが小さすぎる。
• 多数の河川が掲載されているので、関心のある河川へ行くまでに数ステップかかる。
• 各自に関心がある河川は、自宅や親戚の家の近くなど、数個程度と思われるが、それを登録して使えない。（Webページのブックマークはできるが...）
• 水位グラフを見るには、河川カメラとは別系統なので、さらに数ステップかかる。

そこで、スマホ用に、自分用にカスタマイズして使い易くするアプリを作成することにしました。結論から言いますと、MIT App Inventorを使って、図２のようなアプリを作成しました。ここでは河川観測点を６ヶ所登録してあります。図２左側図は、[河川名-観測点-リアルタイムカメラ画像情報-水位グラフ情報] がリストになっていて、どれかをクリックすると、直ちに右側へ切り替わり、その河川の写真と水位グラフがセットで表示されます。また、上部の河川名をクリックすると、再度左側へ戻り、別の河川を選択できます。

　この例の「境川：境川橋付近」の写真は穏やかですが、水位グラフは直近数時間わずかに上昇傾向にあることが分かります。このアプリのソースコード（ブロック）全体は図３のとおりです。かなりコンパクトに作成できていると思います。

　詳しいことはここには書けませんが、ポイントをご参考までに以下に示します。図４(a)は、水位観測点の登録です。図２左図に示した観測点情報をテキストファイルに入れてあり、それを読み込んで、ListPickerの要素にしています。画像やグラフのURLは少し複雑な名称（文字列）ですが、共通部も多いので、このテキストファイルには、各画像に固有のコード情報のみを与えています。

　図４(b)は、ListPickerのリストから、河川観測点を選択した場合に、その写真をgetして表示します。図３では、写真を２枚と水位グラフの合計３枚を表示しますが、以下の図では、簡単のため、最初の１枚の写真だけを表示します。なお、画像のURLには、常に最新の画像が割り当てられるようになっています。

　このスマホアプリは、画像のURLから画像を表示しているだけなのですが、最も使いやすいユーザーインタフェースにするにはどうするかを考えました。水位情報をデータベース（TinyDB, TinyWebDB, SQLiteなど）にすることなども考えましたが、結局、自分の関心のある数個の河川情報をテキストファイルにして、その内容をListPickerで選択するこの方式に落ち着きました。

　このようなある程度実用的と思われるスマホアプリを、短時間で作成できるMIT App Inventorの有用性を改めて感じる次第です。最後に、登録してある他の河川の状況も示して、この記事を終わります。