chartify.js:table要素をグラフ化表示できるJs

tableタグの要素(td、th等)をグラフ化します。
円・棒・帯グラフ等にできるっぽい。

1.CSSの記述例

以下は任意でです。

<style type="text/css">
<!--
body{
	margin:0;
	padding:0;
}
h1{
	font-size:16px;
	font-weight:normal;
	line-height:2.0em;
	text-align:center;
	padding:15px 0;
}
#idWrap{
	width:700px;
	margin:0 auto;
	text-align:center;
}
-->
</style>

2.ヘッダーとJavaScriptの記述例

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="chartify.js"></script>
<script type="text/javascript">
$(function() {
	//グラフ化するtableのid名を指定
	$('#idGraph').chartify(
	'pie', {	//pie(円グラフ)、bar(棒グラフ)
		pieChartRotation: -1.256/2,	//回転
		showLegend: false,	//説明の表示
		colors: ["ffffff", "ff66ff"]	//色
	});
});
</script>

3.HTMLの記述例

<table id="idGraph">

<thead>

<tr>

<td></td>


<th>少ない方</th>


<th>多い方</th>

</tr>

</thead>


<tbody>

<tr>

<th>金額</th>


<td>1.256</td>


<td>5.027</td>

</tr>

</tbody>

</table>

chartify.js:table要素をグラフ化表示するデモページ

ソース元:Chartify – A Visualization Plugin for jQuery

エクセルでやることはあっても、Jsでやることは今までまだ無いです。