0

I'm using Angular 14 and have added the following imports and have registered as follows in my component where I'm using chart.js.

import { Chart, registerables } from 'chart.js';
import 'chartjs-plugin-annotation';
Chart.register(...registerables);

I receive the following compiler error and would appreciate help understanding how to resolve it.

./node_modules/chartjs-plugin-annotation/dist/chartjs-plugin-annotation.esm.js:438:2-20 - Error: export 'addRoundedRectPath' (imported as 'addRoundedRectPath') was not found in 'chart.js/helpers' (possible exports: HALF_PI, INFINITY, PI, PITAU, QUARTER_PI, RAD_PER_DEG, TAU, TWO_THIRDS_PI, _addGrace, _alignPixel, _alignStartEnd, _angleBetween, _angleDiff, _arrayUnique, _attachContext, _bezierCurveTo, _bezierInterpolation, _boundSegment, _boundSegments, _capitalize, _computeSegments, _createResolver, _decimalPlaces, _deprecated, _descriptors, _elementsEqual, _factorize, _filterBetween, _getParentNode, _int16Range, _isPointInArea, _limitValue, _longestText, _lookup, _lookupByKey, _measureText, _merger, _mergerIf, _normalizeAngle, _pointInLine, _rlookupByKey, _setMinAndMaxByKey, _steppedInterpolation, _steppedLineTo, _textX, _toLeftRightCenter, _updateBezierControlPoints, almostEquals, almostWhole, callback, clearCanvas, clipArea, clone, color, debounce, defined, distanceBetweenPoints, drawPoint, each, easingEffects, finiteOrDefault, fontString, formatNumber, getAngleFromPoint, getHoverColor, getMaximumSize, getRelativePosition, getRtlAdapter, getStyle, isArray, isFinite, isFunction, isNullOrUndef, isNumber, isObject, listenArrayEvents, log10, merge, mergeIf, niceNum, noop, overrideTextDirection, readUsedSize, renderText, requestAnimFrame, resolve, resolveObjectKey, restoreTextDirection, retinaScale, sign, splineCurve, splineCurveMonotone, supportsEventListenerOptions, throttled, toDegrees, toDimension, toFont, toFontString, toLineHeight, toPadding, toPercentage, toRadians, toTRBL, toTRBLCorners, uid, unclipArea, unlistenArrayEvents, valueOrDefault)

Per the chartjs-plugin-annotation.js readme:

For Chart.js 3.0.0 to 3.6.2 support, use version 1.4.0 of this plugin

So, I believe I'm using compatible versions of chart.js and chartjs-plugin-annoation.js

  • I think that's a issue on the readme and of course on the version 1.4.0 which doesn't have any dependencies with the proper minimum Chart.js version. Maybe you can open an issue in the repo. Can you use CHart.js 3.7.0 version? – user2057925 May 30 '23 at 08:39
  • @user2057925 Thanks. I'll try upgrading to Chart.js 3.7.0 and upgrading the plugin accordingly. – Rich Stewart May 30 '23 at 14:24
  • @user2057925 Just upgrading Chart.js to v3.7.0 got it to compile. Thanks! – Rich Stewart May 31 '23 at 00:36
  • welcome! I'm going to fix the README and the doc asap. Thank you too to catch it! – user2057925 May 31 '23 at 06:32

0 Answers0