pie chart - data labels - ERROR #141
Comments
|
@kevinjamesbaker |
|
Closing as outdated, feel free to re-open with the requested additional info. |
|
I've recently faced the same issue. Here's Codepen script which demonstrates the issue in action. See browser console for the errors there. The chart sometimes renders fine, but if you're lucky enough it will stuck at animation. But even if it's rendered properly the same error occurs whenever you hover the doughnut areas with a mouse pointer. Hope you'll be able to shed some light on the issue, cause it looks like the one which is very hard to debug properly without a deep knowledge of the library sources. |
|
The issue seems to be that with doughnut/pie charts the vScale is optional, per the Chartjs docs and if there's no scale, the origin is null function getScaleOrigin(el, context) {
var scale = context.chart.getDatasetMeta(context.datasetIndex).vScale;
if (!scale) {
return null;
}
...So when the x/y properties are grabbed off the null origin, explosion function orient(point, origin) {
var x0 = origin.x;
var y0 = origin.y;
... |
|
So what's the work around of vScale property for pie charts? |
|
I am using chartjs in nodejs using chartjs-node-canvas to generate charts and facing same issue when trying to generate multiple charts. First chart rendering perfectly. When I am trying to generate the second chart its throwing error var x0 = origin.x; |
|
Same problem here with pie and doughnut charts. Edit: |
|
Same problem here when using Pie Chart: Any solution? |
|
Hello, I'm having the same issue: This only happens to me when using the ES2015 syntax (import ChartDataLabels from 'chartjs-plugin-datalabels';). Versions installed: |
|
any solution, guys. Don't believe that do a downgrade is the way. |
|
The problem occurs at the function getPositioner(el) {
if (el instanceof chart_js.ArcElement) {
return positioners.arc;
}
if (el instanceof chart_js.PointElement) {
return positioners.point;
}
if (el instanceof chart_js.BarElement) {
return positioners.bar;
}
return positioners.fallback;
}In this function when using Pie or Doughnut charts at the first As a workaround I rewrite that function as below and it works fine. function getPositioner(el) {
if (el.constructor.name === 'ArcElement') {
return positioners.arc;
}
if (el.constructor.name === 'PointElement') {
return positioners.point;
}
if (el.constructor.name === 'BarElement') {
return positioners.bar;
}
return positioners.fallback;
} |
I can issue a PR for this, this is the fix |
|
When will the new release be on npmjs. Or is there another way to get this fixed version? |
|
I was going to post an issue I am having using chartjs-plugin-datalabels with an ESM project in node. It works fine as a CommonJS module but changing the syntax to ESM standard and I get the same issue in getPositioner with the "instanceof" failing. Patched the module as noted above by @libnine and it all works fine now. Definitely like this patch. It also works with the CommonJS code as well. |
"chart.js": "2.8.0",
"chartjs-node-canvas": "2.4.0",
"chartjs-plugin-datalabels": "^0.6.0"
{"type":"pie","data":{"labels":["Managed Ca..","Medicare A","Private"],"datasets":[{"data":[101,102,103],"label":"Daily Census","backgroundColor":["rgba(54, 162, 235, 0.2)","rgba(255, 206, 86, 0.2)","rgba(75, 192, 192, 0.2)"],"borderColor":["rgba(54, 162, 235, 1)","rgba(255, 206,
86, 1)","rgba(75, 192, 192, 1)"],"borderWidth":0,"format":"0.00a"}]},"options":null}
function orient(point, origin) {
var x0 = origin.x; <-- TypeError: Cannot read property 'x' of null
var y0 = origin.y;
The text was updated successfully, but these errors were encountered: