円グラフ - 強火で進め

基本

Google Chart APIで円グラフを作る時は以下の様に記述します。

http://chart.apis.google.com/chart
?chs=250x200
&chd=t:50,31.5,28.5
&cht=p
&chtt=%E3%82%B3%E3%82%B3%E3%81%AB%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB
&chl=A|B|C

※見やすい様に改行を入れています。実際は改行無しでブラウザのアドレスバーに入力して下さい。

[改行無しバージョン]

http://chart.apis.google.com/chart?chs=250x200&chd=t:50,31.5,28.5&cht=p&chtt=%E3%82%B3%E3%82%B3%E3%81%AB%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB&chl=A|B|C

cht の値を p にすると円グラフに成ります。その他のパラメータについては前回の棒グラフの場合の説明を参照下さい。

なお、サンプルでは値の合計が100に成っていますが特に100にする必要はありません。オーバーしたり、100に満たない場合も適切に処理される様です。

円グラフ(3D)

立体的な円グラフも可能です。 cht の値を p3 にすると立体的な円グラフに成ります。

http://chart.apis.google.com/chart
?chs=320x200
&chd=t:50,31.5,28.5
&cht=p3
&chtt=%E3%82%B3%E3%82%B3%E3%81%AB%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB
&chl=A|B|C

[改行無しバージョン]

http://chart.apis.google.com/chart?chs=320x200&chd=t:50,31.5,28.5&cht=p3&chtt=%E3%82%B3%E3%82%B3%E3%81%AB%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB&chl=A|B|C

円グラフ(3D)の場合は3Dで無いものに比べて横幅がより多く必要です。3Dにした時にこの様にラベル部分が切れて表示される場合は横幅を増やしてみて下さい。

色を変える

色を変える場合は棒グラフの時と同様、 chco に色を指定すればOKです。

http://chart.apis.google.com/chart
?chs=320x200
&chd=t:50,31.5,28.5
&cht=p3
&chtt=%E3%82%B3%E3%82%B3%E3%81%AB%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB
&chl=A|B|C
&chco=FF0000|00FF00|0000FF

[改行無しバージョン]

http://chart.apis.google.com/chart?chs=320x200&chd=t:50,31.5,28.5&cht=p3&chtt=%E3%82%B3%E3%82%B3%E3%81%AB%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB&chl=A|B|C&chco=FF0000|00FF00|0000FF

【参考】

Chart Feature List - Google Chart Tools / Image Charts (aka Chart API) - Google Code
http://code.google.com/intl/ja/apis/chart/docs/chart_params.html#axis_labels