Try this code:
.ts file
public barChartOptions = {
legend: {
labels: {
//fontFamily: '"Arvo", serif',
fontSize: 20,
}
}
};
public chartClicked(e: any): void {
if (e.active.length > 0) {
const chart = e.active[0]._chart;
const activePoints = chart.getElementAtEvent(e.event);
if ( activePoints.length > 0) {
// get the internal index of slice in pie chart
const clickedElementIndex = activePoints[0]._index;
const label = chart.data.labels[clickedElementIndex];
console.log(label)
}
}
}
.html
<div style="display: block">
<canvas id="pie" baseChart
[data]="pieChartData"
[labels]="pieChartLabels"
[chartType]="pieChartType"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"
[options]="barChartOptions"></canvas>
</div>
working link
Github link for this