talking about …

by tango

iOS 用 Web Application (ウェブアプリケーション)「東京の空気 for Mobile」を Ver.3.1.0 にアップデートしました。

Mac での閲覧時にキーボードから簡単にオペレーション出来るようになりました。
表示する地図の種類をテンキーの [7] と [9] で切り替えることが出来ます。[9] で時計回り、[7] で反時計回りに切り替わります。 [8] で TEMP(気温)表示に戻ります。
地図の時間帯を [1] 〜 [6] のキーで切り替えることが出来ます。[1] で1時間前、[3] で1時間後。[4] で1日前、[6] で1日後。[5] で最も古い地図、[2] で最新となります。
テンキーのないキーボードの場合は、代替キーでも操作が可能です。[j] [k] [l] [u] [i] [o] [7] [8] [9] が、テンキーの [1] 〜 [9] に対応します。

また、URL も変更していますので、iPhone / iPad などでホーム画面にショートカット(アイコン)を登録をしている場合は、お手数ですが再登録をお願いします。

touch-icon-180x180

「東京の空気 for Mobile」は、東京都環境局大気汚染地図情報(速報値)ページで公開されている大気汚染地図を iPhone などのスマートフォンから快適にブラウジングする事を目的に作成しました。
気温、風向き、湿度、などの気象観測データーおよび、CO(一酸化炭素)、NOx(窒素酸化物)、PM2.5(微小粒子状物質)などの大気汚染の数値のグラフィカルな地図を、時間単位、一日単位の時系列での推移表示のためのインターフェース設計をしています。

baron-01sett-01


「昨日より温度が5℃も低いからもう一枚着て行こう。」
「風向きが北から西に変わってきたから台風が離れていったみたいだな。」
「この一週間で今日はやけに PM2.5 が高いからマスクしよう。」

この様な感じで、東京都及び近郊地域で、屋外で活動する方のお役に立てるかと思います。

以前から公開していた、Ver.2 が、iOS 9 の仕様変更のため動作不良を起こしていましたので、その対応をいたしました。
また新機能として、Retina Display (レティナディスプレイ)用に画像の高解像度表示に対応しました。いままでLモードで表示していた画像を利用して、倍解像度で表示します。

是非お試しください。

inst-04

iOS では、「ホーム画面に追加」で、iPhone のホーム画面にショートカット(アイコン)を登録すると、全画面で使えますので便利です。


「東京の空気2」

以前からテスト公開していた東京都環境局の大気汚染地図情報ビューワー「東京の空気」をバージョンアップしました。東京都環境局大気汚染地図情報では、気温 (TEMP)、風速 (WIND)、湿度 (HUM)、二酸化窒素 (NO2)、浮遊粒子状物質 (SPM)、光化学オキシダント (Ox)、二酸化硫黄 (SO2)、一酸化炭素 (CO)、一酸化窒素 (NO)、窒素酸化物 (NOx)、メタン (CH4)、非メタン炭化水素 (NMHC)、微小粒子状物質 (PM2.5)の一時間ごとの測定値が地図にマッピングされて提供されています。iPhone などのスマートフォンからの閲覧で文字化け(最近修正されたようです)やレイアウトなど使いにくさを感じていましたのでこのようなアプリケーションを作りました。

inst-05baron-01

前バージョンは PHP の練習用に書いたもので GET メソッドでパラメータの受け渡しをする仕組みでした。画像の切替時には画面推移を伴います。

今回は、スマートフォン用に、特に iPhone、iPad など iOS 機器でウェブアプリケーションとして使うため、プログラムを JavaScript / Ajax で全面的に書き換えました。これで iOS 機器で Web クリップアイコンから起動して使っていても画面推移時に MobileSafari.app に移ることがなくなります。


sett-01

また、こちらを見ていただくとわかるのですが、東京都環境局大気汚染地図情報の地図は東京都の輪郭のみで周辺情報がありません。
海岸線や県境の区別がなく、実際の地図とリンクしにくいと思っていましたので、周囲の都道府県の白地図をオーバーレイ表示するようにしました。道路や鉄道など、どこまでを表示要素にするか考えましたが、情報量を増やすとかえって見えにくくなりますので市区の行政区分と河川までを表示することにしました。

このオーバーレイ地図は透過度を自由に設定できるようにしてあります。

Ajax フレームワークとして、jQuery と jQuery Mobile を使用しています。
スマートフォンだけでなく Mac OS、Windows でも大丈夫です。イマドキのモダンブラウザーならほぼ表示に違いはないと思いますが、Internet Explorer 8 以下には対応しておりません。


2013/09/07 – ver.2.0.3 機能追加

パーマリンク(固定リンク)機能を追加しました。
特定の地図へのリンクが出来るようになりました。表示している地図の種類、日時などの情報そのままリンク出来ます。右肩の (i) ボタンからインフォメーションのページを開いて「Permalink」をご覧ください。
ただし日時については、画像が公開されている東京都環境局大気汚染地図情報の仕様のため現在より8日前の地図までしか表示されません。それより過去の地図が指定されていた場合は、その時点での最も過去の地図が表示されます。

tokyo_air_01

「東京の空気 for iPhone」

東京都環境局の大気汚染地図情報(速報値)に、最近話題の PM2.5 の情報が追加になり公開されましたので、「東京の空気 for iPhone」の方でも対応しました。


tokyo_air_02

東京で自転車で行動している人には必携の「東京アメッシュ」ですが、残念ながら iPhone/iPod touch の MobileSafari.app ではきちんと表示できません。そこで以前よりこちらの「東京アメッシュ for iPhone 」を使わせていただいています。



あまり知られていないようですが、もう一つ東京での自転車生活に便利なサイトがあります。

東京都環境局が運営している「大気汚染地図情報(速報値)」というサイトです。

都内各地の気温分布、風向、風量、湿度、などをはじめ NOx、CO、他多種の大気成分の分布地図を過去約8日間、1時間毎の時系列でみる事が出来ます。私はこのうち特に、気温、風向、風量を参考にしています。

ただ残念ながらここは英語環境の MobileSafari.app ではデフォルトの文字コード設定のため文字化けしてしまいます。ちなみに日本語環境では大丈夫なようです。これだけのために日本語環境にするのは嫌なので MobileSafari.app で使うのはあきらめていたのですが、やっぱり不便なので自分用にこんな物を作りました。




「東京の空気 for iPhone」

Web Application というくくりになる物かと思いますが、php で書いた通常の html です。
Mac/PC のブラウザーからもご覧いただけますが、CSS を MobileSafari.app に決め打ちにして作成していますのでうまく表示されないかもしれません。
画像データについては、「大気汚染地図情報(速報値)」からそのままお借りして読み出しています。

とりあえずしばらくテスト公開しておきますので、興味のある方はお試しください。

COPYRIGHT (c) 2006-2024 ZERO OFFICE CO., LTD. | Powered by WordPress