Accepted answer

hopefully this helps others:

the error was a result of the axis min value not being defaulted to zero. once that was applied to the axes all functions as expected.


ok, i'm using angular v13 with chart.js v 3.7 and chartjs-plugin-datalabels v 2. i struggled a lot trying to get things working. the problem was not errors, but the labels were just not appearing. turned out that i had to add .default to the plugin reference:

public chartplugins = [plugindatalabels.default];

now you can bind this chartplugins variable to the canvas:

 <canvas basechart

and then it works!

enter image description here


i know this isn't exactly the same problem that the op had, but i had a bit of trouble with the angular cli compiling the code properly.


  "projects": {
    "myproject": {
      "architect": {
        "build": {
          "options": {
            "scripts": [

create index.d.ts file with contents:

declare module 'chartjs-plugin-datalabels'

import as follows:

import chartdatalabels from 'chartjs-plugin-datalabels';


install chartjs-plugin-datalabel by

npm install chartjs-plugin-datalabels --save

then import the same in component by

import chartdatalabels from 'chartjs-plugin-datalabels';

and add


this worked for me . hope it will work.

Related Query

More Query from same tag