ChartJs - Pie Chart - how to remove labels that are on the pie chart

Question

I am using piechart from chart.js for visualization in my application. I am using a plug-in with it chartjs-plugin-piechart-outlabels to show the labels as out-segments from the pie chart.

It's all working fine, except that, the labels exists on the pie chart, which I do not want, as I am showing the labels as out-segments.

I have looked through documentation and couldnt find solution to this, also looked some examples.

public static readonly pieChartOptions: ChartOptions = {
responsive: true,
maintainAspectRatio: false,
legend: {
  display: false
},
tooltips: {
  enabled: true
},
layout: {
  padding: {
    left: 0,
    right: 0,
    top: 70,
    bottom: 0
  }
},
plugins: {
  outlabels: {
    display: true,
    borderWidth: 2,
    lineWidth: 2,
    padding: 3,
    textAlign: 'center',
    stretch: 15,
    font: {
      resizable: true,
      minSize: 12,
      maxSize: 18
    },
    valuePrecision: 1,
    percentPrecision: 2
  }
}

};

Are you sure you don't use any other plugins like `chartjs-plugin-labels`? I'm asking because chartjs by default doesn't render those labels — yurzui, Apr 24 '19 at 17:42
@yurzui aahh! my bad, you are right, it was referenced in the module. I did not reverify it! Thanks for pointing this. — user1722043, Apr 24 '19 at 21:02
@user1722043 Is this plugin still working ? chartjs-plugin-piechart-outlabels — Revathi Sekar, Jan 07 '21 at 11:45

score 2 · Answer 1 · edited May 16 '19 at 13:39

2

You need to turn off the sample labels, like this:

options: {
  plugins: {
    datalabels: {
      display: false
    }
    outlabels: {
      display: true
    }
  }
}

edited May 16 '19 at 13:39

brooksrelyt

3,925
5
31
54

answered May 16 '19 at 13:23

danillo fidel gomes

21
2

This is exactly what I was looking for. Thank you! – HartleySan Mar 30 '21 at 12:34

score 0 · Answer 2 · answered Apr 24 '19 at 21:04

0

@yurzui mentioned, there was reference of chartjs-plugin-labels which i missed to remove. Thanks @yurzui

answered Apr 24 '19 at 21:04

user1722043

145
3
11

ChartJs - Pie Chart - how to remove labels that are on the pie chart

2 Answers2

Linked