YouTipChartjs Pie
# Chart.js Pie Chart
A pie chart (or pie graph) is a circular statistical chart divided into several sectors, used to describe the relative relationship between quantities, frequencies, or percentages. In a pie chart, the arc length (as well as the central angle and area) of each sector is proportional to the quantity it represents. These sectors together form a complete circle. As the name suggests, these sectors form a pattern resembling a cut pie.
The pie chart **type** property is 'pie', which describes the chart type.
const config = { type: 'pie', data: data,};
Next, let's create a simple pie chart:
## Example
const ctx = document.getElementById('myChart');
const data ={
labels:[
'Red',
'Blue',
'Yellow'
],
datasets:[{
label:'Pie Chart Example',
data:[300,50,100],
backgroundColor:[
'rgb(255, 99, 132)',
'rgb(54, 162, 235)',
'rgb(255, 205, 86)'
],
hoverOffset:4
}]
};
const config ={
type:'pie',
data: data,
options:{
responsive:true,// Set the chart to be responsive, changing according to the screen window
maintainAspectRatio:false,// Maintain the chart's original aspect ratio
scales:{
yAxes:[{
ticks:{
beginAtZero:true
}
}]
}
}
};
const myChart =new Chart(ctx, config);
[Try it »](#)
The output of the above example is: