tableの内容を簡単にグラフ化するjQueryプラグイン「gvChart」

使用方法

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jquery.gvChart.js"></script>
<script type="text/javascript">
gvChartInit();
$(document).ready(function(){
	$('#id名').gvChart({
	chartType: 'ColumnChart',
	//その他に AreaChart、LineChart、BarChart、ColumnChart、PieChartがあります。
	gvSettings: {
		vAxis: {title: 'No of players'}, //縦軸タイトル
		hAxis: {title: 'Month'}, //横軸タイトル
		width: 720, //幅
		height: 300, //高さ
		}
	});
</script>

<table id="id名">
<caption>Game players count</caption>
	<thead>
		<tr>
			<th></th>
			<th>Jan</th>
			<th>Feb</th>
			<th>Mar</th>
			<th>Apr</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<th>2010</th>
			<td>125</td>
			<td>185</td>
			<td>327</td>
			<td>359</td>
		</tr>
		<tr>
			<th>2009</th>
			<td>1167</td>
			<td>1110</td>
			<td>691</td>
			<td>165</td>
		</tr>
	</tbody>
</table>

サンプル