While upgrading Chart.js to v3 and plugin libraries to their latest versions, I've noticed that data labels on my matrix charts become aligned differently than in pre v3.
Note the datalables are aligned to the top left corner of the matrix blocks with default settings. On other types of charts (e.g. bar) they are correctly placed as in the pre v3 version.
I've tried different modifications of position options (anchor, align, offset), but haven't succeeded to align them properly. Also I'm not sure if it's an issue of datalabels or matrix plugin (or not an issue at all, but different configuration), but would appreciate any help on it.
While upgrading Chart.js to v3 and plugin libraries to their latest versions, I've noticed that data labels on my matrix charts become aligned differently than in pre v3.
Pre v3 Chart.js matrix chart with datalables
chart.js@2.9.4chartjs-chart-matrix@0.1.3chartjs-plugin-datalabels@0.7.0JSFiddle
Note the datalables are aligned in the center of the matrix blocks with default settings.
v3 Chart.js matrix chart with datalables
chart.js@3.8.0chartjs-chart-matrix@1.1.1chartjs-plugin-datalabels@2.0.0JSFiddle
Note the datalables are aligned to the top left corner of the matrix blocks with default settings. On other types of charts (e.g.
bar) they are correctly placed as in the pre v3 version.I've tried different modifications of position options (
anchor,align,offset), but haven't succeeded to align them properly. Also I'm not sure if it's an issue of datalabels or matrix plugin (or not an issue at all, but different configuration), but would appreciate any help on it.