'Hide label on slice of Doghnut/Pie Chart Angular ng2-charts
I have started using ng2-charts with Angular where I need to hide the text/value coming on slice of doughnut/Pie chart as shown and highlighted in below screenshot
pieChartOptions = {
responsive: true,
maintainAspectRatio: false,
tooltips:{
callbacks: {
label: (ttItem,data) => (`${data.labels[ttItem.index]}: ${data.datasets[ttItem.datasetIndex].data[ttItem.index]}%`)
}
},
plugins: {
display:false,
// labels: {
// // render: 'percentage',
// // fontColor: ['red', 'red', 'red'],
// // precision: 2,
// display:false
// },
datalabels: false ,
label:false,
},
legend: {
position: 'bottom',
labels: {
fontColor: "black",
boxWidth: 15,
padding: 10,
fontFamily: 'Poppins ',
fontSize: 12,
},
},
animation: {
animateScale: true,
animateRotate: true
}
};
isPieChartPercentage :boolean = true;
pieChartColors = [
{
backgroundColor: [
'rgb(144, 238, 144)',
'#ADD8E6',
'#ffff80',
'#e0eafc',
'#f0b961',
'black'
]
}
]
I tried this things which didn't worked for me
options: {
datalabels: {
display: false, //not working
},
}
options: {
labels: {
display: false // not working
},
}
options: {
labels:false //not working
}
Any help will be appreciated.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|

