Type '"doughnutLabel"' is not assignable to type '"line" | "label" | "box" | "ellipse" | "point" | "polygon" | undefined'

[BlackyUmbreon]

Using Chart.js^4.4.8 and chartjs-plugin-annotation^3.1.0
I added doughnut annotation into chart, but it comes up the error message with this
Type '"doughnutLabel"' is not assignable to type '"line" | "label" | "box" | "ellipse" | "point" | "polygon" | undefined'.

annotations: { label: { type: "doughnutLabel" } }

[Jan-Heussner]

i could solve it with innerlabel.

annotation: {
      annotations: {
        innerlabel: {
          type: 'doughnutLabel',
          click: handleAnnotationClick,
          content: [properties.centerText],
          font: {
            size: properties.centerTextSize,
            weight: 'bold',
          },
          color: '#417690',
        },
      },
    },

[Rometheman]

i could solve it with innerlabel.

annotation: {
      annotations: {
        innerlabel: {
          type: 'doughnutLabel',
          click: handleAnnotationClick,
          content: [properties.centerText],
          font: {
            size: properties.centerTextSize,
            weight: 'bold',
          },
          color: '#417690',
        },
      },
    },

This does not work for me, it seems that the latest release 3.1.0 does not have the donutLabel type on the options.d.ts which is currently on the master branch

[Jan-Heussner]

    "chart.js": "^4.4.8",
    "chartjs-plugin-annotation": "^3.1.0",

I use it with the actual versions. Are u sure u are using innerlabel?

[datskill]

I have the same problem, using innerlabel, I also get the error

chartjs 4.4.8
plugin : 3.1.0

[ThomasGodard]

Adding as DounghnutLabelOptions solves the problem for me (Typescript/angular) :

const options = {
  plugins: {
    annotation: {
      annotations: {
        dLabel: {
          type: 'doughnutLabel',
          content: ({chart}) => ['Total',
            chart.getDatasetMeta(0).total,
            'last 7 months'
          ],
          font: [{size: 60}, {size: 50}, {size: 30}],
          color: ['black', 'red', 'grey']
        } as DoughnutLabelOptions
      }
    }
  }
};

Not the best option, but a working option.

FYI: the interface AnnotationTypeRegistry doesn't have DoughnutAnnotationOptions. Maybe it's a hint.

[KimiNako]

This seems to be fixed through this commit: 1e95744

But this commit was made after the 3.1.0 release, so I suppose we need to wait for the next release.