円グラフを表示しています。しかし、円グラフでラベルを表示する方法。
以下は円グラフのchart.jsコードです。
this.Pie = function(data, options) {
chart.Pie.defaults = {
segmentShowStroke: true,
segmentStrokeColor: "#fff",
segmentStrokeWidth: 2,
animation: true,
animationSteps: 100,
animationEasing: "easeOutBounce",
animateRotate: true,
animateScale: false,
onAnimationComplete: null
};
var config = (options) ? mergeChartConfig(chart.Pie.defaults, options) : chart.Pie.defaults;
return new Pie(data, config, context);
};
以下は円グラフを表示するためのhtmlファイルのコードです
コード:
var data = [{
value: 20,
color: "#637b85"
}, {
value: 30,
color: "#2c9c69"
}, {
value: 40,
color: "#dbba34"
}, {
value: 10,
color: "#c62f29"
}];
var canvas = document.getElementById("hours");
var ctx = canvas.getContext("2d");
new Chart(ctx).Pie(data);
編集:http : //jsfiddle.net/nCFGL/223/私の例。
あなたは次のようにできるはずです:
var pieData = [{
value: 30,
color: "#F38630",
label: 'Sleep',
labelColor: 'white',
labelFontSize: '16'
},
...
];
次の場所にあるChart.jsを含めます。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加