スタートページJavascriptChart.js

Chart.js 円グラフ・ドーナツチャート・鶏頭図


円グラフ・ドーナツチャート

ドーナツチャートのソースリストを示します。
options の cutoutPercentage は、中央空白サイズの円に対する比率で、0にすると円グラフになり、100にすると円周だけになります。
cutoutPercentage を外して、type を pie/polarArea とすれば円グラフ/鶏頭図になります。
円グラフとドーナツチャートは、系列数を増やして多重円にすることができます。

data: [150, 200, 100, 50] の合計は100になりませんが、自動的に内部で比率が計算され円になります。
鶏頭図は角度で比率を示し、半径で与えたデータの値を示しています。