レスポンシブな円グラフを書ける軽量jQueryプラグイン「Flatmin responsive Piechart Plugin」

円グラフを記述できるJavaScriptは多くありますが、jQueryプラグインのPie Chart jQuery Plugin - Flat Frameworkを利用すると簡単かつ軽量かつ、レスポンシブな円グラフを採用することが可能です。

sponsors

使用方法

Pie Chart jQuery Plugin - Flat Frameworkからファイル一式をダウンロード。

<link href="/test/css/piechart.css" rel="stylesheet">
<script type="text/javascript" src="/test/js/jquery-1.9.1.min.js"></script>
<script src="/test/js/piechart.js"></script>
<script>
$(document).ready(function() {
	$('.class名').piechart([
		["項目名", "数字"], 
		["China", 1360, 'blue'],
		["India", 1234],
		["USA", 316]
	]);
});
</script>
あとは上記で付与したクラスを追加すれば完成です。

<div class="class名" style="padding:0;margin:0;width:60%;"<>/div>

サンプル

sponsors

Javascriptサンプルページ一覧
skuare.net