chartjs / chartjs-plugin-annotation

Annotation plugin for Chart.js
MIT License
607 stars 329 forks source link

TypeError: Cannot read properties of undefined (reading 'borderWidth') in Angular 16 #953

Open Venators opened 3 weeks ago

Venators commented 3 weeks ago

Hello 👋🏻

I utilised charts-plugin-annotation in an Angular project, and it worked without issue under Angular 15, but since migrating to Angular 16, the annotation plugin errors and breaks the rendering of the chart it plugged into - I haven't found a similar issue logged - and this is the error I receive: loader.interceptor.ts:25 ERROR TypeError: Cannot read properties of undefined (reading 'borderWidth') at resolveLabelElementProperties (chartjs-plugin-annotation.esm.js:2141:31) at LineAnnotation.resolveElementProperties (chartjs-plugin-annotation.esm.js:1948:29) at updateElements (chartjs-plugin-annotation.esm.js:2717:32) at Object.afterUpdate (chartjs-plugin-annotation.esm.js:2894:5) at callback (helpers.segment.js:79:19) at PluginService._notify (chart.js:5091:25) at PluginService.notify (chart.js:5074:29) at Chart.notifyPlugins (chart.js:6356:30) at Chart.update (chart.js:5917:14) at Chart.<anonymous> (chart.js:5659:48) And the annotation plugin method where the error occurs: image

My configuration of the plugin is like so: image And it hasn't changed through the update, which touched the following packages:

After discovering the issue, I've also tried chartjs-plugin-annotation 3.1.0 and chart.js 4.4.4/4.4.5, but the issue persists. Any help on this would be appreciated if someone can see where I'm going wrong or has also encountered this themselves and found a solution?

stockiNail commented 3 weeks ago

@Venators this issue sounds to be related to the missing registration of the plugin to Chartjs.. How are you registering it?