あったらいいな、ゆらぎデザイン

グーグルチャートサンプル


折れ線グラフ 
<img src="http://chart.apis.google.com/chart?cht=lc
&amp;chs=300x125
&amp;chg=20,50,1,5
&amp;chxt=x,y
&amp;chxl=0:|1|2|3|4|5|6|7|1:|0|30|90
&amp;chd=t:10,10,14,30,80,40,100
&amp;chm=s,FF9904,0,-1,6" />
折れ線グラフ(塗りつぶし)
<img src="http://chart.apis.google.com/chart?cht=lc
&amp;chs=300x125
&amp;chg=20,50,1,5
&amp;chxt=x,y
&amp;chxl=0:|1|2|3|4|5|6|7|1:|0|30|90
&amp;chd=t:10,10,14,30,80,40,100
&amp;chls=2,7,4
&amp;chcs=FF9900
&amp;chm=B,FFC266,0,0,0" />
折れ線グラフ(範囲マーカー)
<img src="http://chart.apis.google.com/chart?cht=lc
&amp;chs=300x125
&amp;chg=20,50,1,5
&amp;chxt=x,y
&amp;chxl=0:|1|2|3|4|5|6|7|1:|0|30|90
&amp;chd=t:10,10,14,30,80,40,100
&amp;chm=r,FFEBCC,0,0.20,0.75|s,FF9904,0,-1,6" />
棒グラフ
<img src="http://chart.apis.google.com/chart?cht=bvs
&amp;chs=300x125
&amp;chg=20,50,1,5
&amp;chxt=x,y
&amp;chxl=0:|1|2|3|4|5|6|7|1:|0|30|90
&amp;chco=FFC266
&amp;chd=t:10,50,14,30,80,40,20" />
棒グラフ(データ線付き)
<img src="http://chart.apis.google.com/chart?cht=bvs
&amp;chs=300x125
&amp;chg=20,50,1,5
&amp;chxt=x,y
&amp;chxl=0:|1|2|3|4|5|6|7|1:|0|30|90
&amp;chd=t:10,50,14,30,80,40,20
&amp;chco=FFC266
&amp;chm=D,FF9900,0,0,3,1" />
棒グラフ(テキストマーカー)
<img src="http://chart.apis.google.com/chart?cht=bhg
&amp;chs=300x250
&amp;chg=20,50,1,5
&amp;chxt=y,x
&amp;chxl=0:|1|2|3|4|5|6|7|1:|0|30|90
&amp;chd=t:10,50,14,30,80,40,20
&amp;chm=tHomepage,333333,0,0,13,1|tPamphlet,333333,0,1,13,1|tDirect+mail,333333,0,2,13,1|tInfomation,333333,0,3,13,1|tOther+Sites,333333,0,4,13,1|tAds,333333,0,5,13,1|tNews+paper,333333,0,6,13,1
&amp;chco=FFC266" />
円グラフ
<img src="http://chart.apis.google.com/chart?cht=p
&amp;chd=t:14711,11684,3431
&amp;chs=300x150
&amp;chl=1|2|3" />
円グラフ(3D)
<img src="http://chart.apis.google.com/chart?cht=p3
&amp;chd=t:14711,11684,3431
&amp;chs=300x150
&amp;chl=1|2|3" />
レーダーチャート
<img src="http://chart.apis.google.com/chart?cht=r
&amp;chd=t:80,30,99,60,50,20
&amp;chs=300x200
&amp;chls=3,0,0
&amp;chxt=x,y
&amp;chxl=0:|Str|Vit|Agi|Dex|Int|Luk|1:|||||
&amp;chm=B,FF990080,0,0,5" />
QRコードも作成できます
<img src="http://chart.apis.google.com/chart?cht=qr
&amp;chs=300x100
&amp;chl=http%3a//archiva.jp/" />

[スポンサード・リンク]

各種パラメーターについて
パラメータ 意味 構文
cht 図のタイプ cht=lc
chs 図のサイズ chs=250x100
chg グリッド線 chg=[x軸のステップサイズ],[y軸のステップサイズ],[分断線],[空白線]
chxt 複数軸ラベル（軸タイプ） chxt=x,y,r,x
chxl 複数軸ラベル（軸ラベル） chxl=
0:|Jan|July|Jan|July|Jan|
1:|0|100|
2:|A|B|C|
3:|2005|2006|2007
chls 線のスタイル chls=[線の太さ],[線の長さ],[空白の長さ]
chcs 線の色 chcs=FF9900
chco チャートの色 chco=FFC266
chm=r 範囲マーカー chm=[r(水平範囲)/R(垂直範囲)],[色],0,[始点],[終点]
chm=D 棒グラフのデータ線 chm=D,[色],[data set index],0,[サイズ],[描画順序 1/0/-1]
chm 図形マーカー chm=[図形タイプ],[色],[data set index],[data point],[サイズ],[描画順序 1/0/-1]