PM2.5のグラフをまたChart::Clickerで生成するようにしてみた。

下記の記事で紹介してほそぼそとやっている「微小粒子状物質(PM2.5) 時報グラフ」のサイトですが、最近スマホにも対応したりしてちょこちょこ弄ったりしています。グラフの生成をChart::ClickerからGoogle Charts APIに切り替えて運用していました。

熊本県庁が公開しているPM2.5の測定値をグラフ化してみた。 | KUMA TYPE

Google Charts APIにした理由ですが、グラフが簡単で綺麗にできるということもありますが、一番の対策は負荷対策でした。15分毎に各測定局のグラフを生成していたのですが、Chart::Clickerはめちゃくちゃ重いので、かなりの負荷がサーバーにかかります。それでデータだけ渡せば生成から表示までやってくれるGoogle Charts APIにしました。

PCならこれでいいんですけど、スマホやタブレットで見るときにどうも回線が貧弱だったり、スマホが貧弱だったりすると表示されるまでにかなり時間がかかるように感じたので、またChart::Clickerに戻すことを考えました。画像として生成してしまったほうがそれは表示は早いだろうと考えたからです。データ量から言えばGoogle Charts APIの方に軍配があがると思いますが、今の世の中でパケ放題しないでスマホでウェブを閲覧(しかもうちのサイトを)する人もそうそういないと思うので、データ量的にはあまり問題無いと考えました。

ただChart::Clickerに戻しても、元のもくあみなので、多少工夫をしました。今までは、データ取得した際にすべてのグラフをその場ですべて生成していました。その為にサーバのリソースを無駄に大量に消費していました。今回はデータを消費してもDBに蓄積するだで、グラフ画像の生成は行わないようにしています。グラフが表示されるときに初めてグラフを生成する様にしました。そのおかげで大幅なリソースの節約になりました。初回の表示にはちょっとだけ時間がかかりますが一度表示すれば次の生成まではさくさく表示されます。

また、最初は画像を表示するプログラムで画像の生成もしていましたが、画像生成のためにChart::Clickerをuseするだけでかなり重くなってしまうので、これをChart::Clickerをuseしない画像を読み込んで表示するだけのプログラムと生成するプログラムに分けることにより、既に生成済みの画像はさくさく表示されるようになりました。

また、生成されるグラフにも少し手を加えたのでプチ洗練されたとおもいます。

 

WS2014-06-28_13_11_49
Google Charts APIで生成のもの。

pm25_TOKY_42
Chart::Clickerで生成していた過去のグラフ

pm25_01
Chart::Clickerで生成した新しいグラフ

とりあえず、熊本県だけChart::Clickerに戻して運用してみます。

様子を見てどちらがいいのかを見極めたいと思います。

WS2014-06-28_13_37_14
とりあえず、ほぼ自分用でほとんど利用者もいないのですが、見ての通り利用者は基本リピーターの方なので、ご利用の方はご意見いただけますと幸いです。

現在、九州と広島・大阪・兵庫・東京・神奈川・埼玉と自分に関係の深い都府県のみ対応しています。

全国に対応して掲示板機能つけて地域コミュニティー的なものにしようかなとも思ったり思わなかったり、やっぱり面倒だからやめよう。

[PM2.5グラフ]熊本県 微小粒子状物質(PM2.5) 時報グラフ

タグ : , ,