先日リリースされたGoogleのグラフ作成API、「Google Charts」、そのうち生成ツールが出てくるでしょうけど、いち早く試したかった

Googleのかんたんグラフ作成API「Google Charts」を試す

2007-12-09 | Sigeo | 0 | カテゴリ Google 全般, WEBツール・サービス

グーグルのかんたんグラフ作成API

先日リリースされたGoogleのグラフ作成API、「Google Charts」、そのうち生成ツールが出てくるでしょうけど、いち早く試したかったので実践してみました。

スポンサードリンク

かんたんグラフ作成API「Google Charts」

ホントにかんたんな設定でいろいろなグラフを描く事ができる「Google Charts」。いろいろ楽しめそうです。サンプルと合わせてご紹介していきます。

3D円グラフ

↑これは日本の検索エンジンシェアを現した円グラフの3Dバージョン。

1. 3Dバージョンのコード
Point:3Dにする場合は”cht=p3″と設定
Option:グラフタイトルは”&chtt=「チャートの+タイトル」”を追加(日本語はひらがなとカタカナのみOK、漢字も使えるようになるといいですね。)

2D円グラフ

2. 2Dバージョンのコード
Point:2Dにする場合は”cht=p”と設定
Option:色の指定は”chco=「カラーコード」”と設定

ベン図

ベン図のコード
Point:”t:100,80,60,30,30,50,10″の部分は最初の”100,80,60″で三つの円の大きさを設定、次の”30,30,30″で交わり具合を設定、最後の”10″で三つの円が重なる部分の大きさを設定できます。
Option:グラフの概要を表示したい場合は”chdl=First|Second|Third”と設定
Option:

折れ線グラフ

折れ線グラフのコード
Point:折れ線グラフは”cht=lc”で設定
Point:折れ線の数値は”chd=s:「数値記号」”で設定。数値記号は0~61まで設定可能で、0が「A」、25が「Z」、26が「a」、51が「z」、52が「0」61が「9」という順番になっています。ちなみに上のグラフは「Aacz」なので「0⇒26⇒28⇒51」という数値になっています。

複数の折れ線グラフ

複数の折れ線グラフのコード
Point:複数の折れ線グラフは”cht=lxy”と設定
Point:こちらの数値の設定は”chd=t:「1本目のシェイプを打つ位置の座標(一番右が100)」|「1本目のグラフ遷移座標」|「2本目のシェイプを打つ位置の座標」|「2本目のグラフ遷移座標」|「3本目のシェイプを打つ位置の座標」|「3本目のグラフ遷移座標」|”と設定していきます
Option:グリッドを表示するには”chg=「横座標」,「縦座標」”と設定、グリッド線の種類も変更可能です⇒”chg=「横座標」,「縦座標」,1,「線の間隔(実線の場合は0)」”

バブルチャート

グーグルのかんたんバブルチャート作成API

バブルチャートのコード
Point:バブルチャートは”cht=s”と設定
Option:シェイプの形は「c」がクロス、「o」がサークル、「a」が矢印、「x」が×など全9種類用意されています

棒グラフ

グーグルのかんたん棒グラフ作成API

棒グラフのコード
Point:2データの比較棒グラフは”cht=bvg”と設定、横バージョンは”cht=bhg”、割合を表示する棒グラフは横が”cht=bhs”縦が”cht=bvs”、単一データの場合は”chbh”となっています
Option:シェイプの形は「c」がクロス、「o」がサークル、「a」が矢印、「x」が×など全9種類用意されています

このようなツールがたくさん出てくると、WEBの視覚化がどんどん進みますよね。一日のリクエスト制限が5万回までという制約もありますが、今後出てくるであろうGoogle Chart APIを利用したグラフ作成ツールやアプリケーションも楽しみです。

関連情報

スポンサードリンク

この記事を読んだ方は以下の記事もご覧いただいています

  • このエントリーをはてなブックマークに追加

コメントする