Web上に円グラフを実装するプラグイン「Pie Chart」を紹介します。
Pie Chart
このプラグインを使えば、項目ごとの数値を入力するだけで簡単に円グラフを作成することができます。
円グラフのタイトルなども簡単に設定できるので、Web上にグラフを載せたいなぁーと思っている方におすすめのプラグインです。
CSSを少し変更すれば、円グラフの色やスタイルも簡単に変更できます。
デモの円グラフをご覧ください。
「Pie Chart」のデモ
ソース(HTML + jQuery)
< title >Pie Chart - jQuery Plugin Demo</ title > |
< meta name = "description" content = "Minesweeperのデモでーす。" > |
< script src = "//code.jquery.com/jquery-1.10.2.min.js" ></ script > |
< script src = "PieChart.js" ></ script > |
< link rel = "stylesheet" href = "PieChart.css" /> |
< li class = "pieChart" value = "220" >赤</ li > |
< li class = "pieChart" value = "350" >青</ li > |
< li class = "pieChart" value = "150" >緑</ li > |
< li class = "pieChart" value = "100" >黄</ li > |
$('#source').pieChart('#target', '円グラフだよー。'); |
jsファイルのダウンロード、その他のオプション詳細はこちらからどうぞ。