![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjymd31ctzCyQNnILZrJWsWsJfDcNHIzUfpORkgzNn6k_Q3BL_9xFRG12YUL1sCDhUX6uuZ8zTEr_7N7-ja8dhrXBs5oegQqS5eV5828d18ELIa1lgd4I_7-zgGa4QDHPLP_E-SHEkoDOPPqjbnadGIw3rvkPGLsQjG96dUz5ajguKjOULl2BZRTPOh/s1600-rw/equalizer-255396_1280.jpg)
GoogleAnalyticsのようなグラフィカルな表示は、使っていてとても便利です。
数字ばかり並んでいる表を見せられても、直感的なものは伝わらないのが現状です。
これは数学オタクの人でもあまり関係なく、人の第一印象は、見た目が90%占めるらしく
視覚の情報がいかに重要かという事だと思います。
絶対視覚
よく仕事で使うエクセルですが、基本的には、ほぼ数字の羅列になります。
こんな感じですよね。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM9hZbjEOr9mlSF5BY6YwPr8BWc0JXAep8VHXATYqoR2OHSjtPNRGtzGc3q_HhudAVZ5QyXI7E4bIoPGxB_CuUT8WQ057hcj4dQJbTGX8OSCJOkNSWQIK4ul5SHBVorVqbAc8eThrOcSkF2ZnYhh1P5CjiEyADvuZ3vvKd23BUhpXVtMMgLmsKJC4d/s1600-rw/2-1-bba939003ded929637367837f6c349c1.png)
気の利いた担当者であれば、これにちょっとしたグラフを付けてくれます。
一気に印象が変わりましたよね。
全体の推移や傾向が分かりやすくなります。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwMvgPNiwZetAnMPRSAcBpA8qp4fPfASSdqXmOBuuiDfsXlTw_MXQkVIY7XaWDZ77WkmxL5p2PIby53AT72vrm6vbQhjcKaKJYZONNlMUxl8xztFxkqaFrhWuqEDuIYUuaKKH6i3mAHWYXLpGjujR4sLyOt-_iYiqKy5Nj_FUFCZaRe0zcENHjtUup/s1600-rw/2-2-cc88f2694596bce779a9d0537e8dc2c3.png)
当たり前なんですが、なかなかこれが難しいんですが、開発者の意見で言うと、
ライブラリを使っても、帳書に対して、効果的なグラフをつけていくというのは中々
仕様を作成する段階からレベルが高いものです。
でも、GoogleがWebAPIとしてChart機能を提供していました。
Google Chart
本家サイト
https://developers.google.com/chart/
なかなかシンプルな作りだし、扱いも簡単そうです。
なんせデータを送るとpngイメージが返ってくるというだけのシンプルさ。
こいつは、研究開発段階程度であれば使わなきゃソンだと判断しました。
早速使ってみる
今回は旧版を使ってます。
新板はJSでAJAX連携でSVGを呼び出すようになってますが、分かりやすく画像で・・・
以前作った、WEBページのアクセス数と人数をロギングする仕組みに入れてみたいと思います。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiJe747xIuQpKrxgeIbkJBCwSYOHua9Cvrnc8fRZAtQvDQUwyvFfnEtJF8dvbxl-Dn29yLVMre4HKPCHHUNAKUi4_iLcj0xkchZ9xKlymrZT51_mATpgNcJM-9lh4RG3Z4eazPqMEG-uTVxMXE2O6Xe2LLpoYzhorsh8XwZjS53VFENROgc0qRkEp0/s1600-rw/2-3-3bce61c8a6c17959ee5ac748e31047cf.png)
とりあえず、適当な数字を入れ込んだ、こんな感じの表を、以下の設定で画像に差し替えて見ます。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRj0tJvstQ3rU16PS9JzwssAWwM-OMxj8KH_fcLUxCR9_6nF8hCslov1-gl-coMVnHU3FjzN47RUVYmIZ34xq28anBqL6pv7wjghGHaLcOXwpVkH30juwjpP9gN1vikFwhyvkYVA6feaf5ikmAmHMcW25ZEgjaOsjnlmarfwlA5kUEca2tHlLdlTaE/s1600-rw/2-4-213241b113cd1e2f1cb00812a5f9a968.png)
簡単にはできましたが、目盛り、区切り線、日付の文字、などが入らないと、何が何やら逆にわかりません。
ちなみに、この時のアクセスURLは
http://chart.apis.google.com/chart?chs=700x200&cht=lc&chd=t:76,88,92,44,51,87,72,98,105,77,77,64,69,49,65,112,65,40,64,81,73,84,64
となってますが、せめてこれで目盛りは表示されてほしかった・・・
次回はもう少し見栄えを良くしてさらに見やすくする予定。
0 件のコメント:
コメントを投稿