React-chartjs-2: Defaults creating error

[nealoke]

I'm trying to use the { defaults } provided by your wrapper but when I pass these into a I get all kinds of errors. (I am not yet modifying these defaults)

My Code

import { Bar, defaults } from 'react-chartjs-2';

// component level
<Bar redraw data={this.props.chartData} height={300} options={defaults} />

Error in console

core.controller.js:443 Uncaught TypeError: Cannot set property '_data' of undefined
    at Chart.Controller.update (core.controller.js:443)
    at Chart.Controller.resize (core.controller.js:306)
    at eval (core.controller.js:224)
    at eval (core.helpers.js:982)
update @ core.controller.js:443
resize @ core.controller.js:306
(anonymous) @ core.controller.js:224
(anonymous) @ core.helpers.js:982
scale.radialLinear.js:113 Uncaught (in promise) TypeError: Cannot read property 'callback' of undefined
    at ChartElement.convertTicksToLabels (scale.radialLinear.js:113)
    at ChartElement.update (core.scale.js:94)
    at getMinimumBoxSize (core.layoutService.js:144)
    at Object.helpers.each (core.helpers.js:23)
    at Object.update (core.layoutService.js:155)
    at Chart.Controller.updateLayout (core.controller.js:381)
    at Chart.Controller.initialize (core.controller.js:250)
    at new Chart.Controller (core.controller.js:231)
    at new Chart (core.js:7)
    at ChartComponent.renderChart (index.js:212)

Version
_Chartjs:_ v2.4.0

[jerairrest]

Does using the release-2.0.0 fix this issue by any chance?

[nealoke]

@jerairrest Will check this asap, but what is the advantage of using the provided defaults? And where do you merge these with your preferences? Is this on the root of your react app for example?

[jerairrest]

Alrighty, after playing around a bit more it looks like you only need to use merge the global defaults along with the chart specific defaults to get the full set.

const {global, bar} = defaults;

        const options = {
            ...global,
            ...bar,
            responsive: true,
            title: {
                display: true,
                text: 'Custom Chart Title',
                fontSize: 150
            },
            scales: {
                xAxes: [{
                    stacked: true
                }],
                yAxes: [{
                    stacked: true
                }]
            }
        };

[jerairrest]

@nealoke I'm closing this for now. Let me know if you are still having troubles

[yairEO]

I have a bunch of errors right now when trying to use the defaults as in the README (a link to those defaults will go a long way so I would know what can be changed)

I've just installed an hour ago (Sep 16, 2018) using:

npm install react-chartjs-2 chart.js --save

JSX:

import {Line as LineChart, defaults}  from 'react-chartjs-2'
...
<LineChart data={data} options={defaults} />

I have many errors, and the first would be:

scale.radialLinear.js:373 Uncaught TypeError: Cannot read property 'callback' of undefined

[Harsha3878]

Recently i have updated the chart.js and react-chartjs-2 library to the latest version 3.0.0-beta. and i am trying this in my code.
import { Doughnut, Line } from 'react-chartjs-2';
toolDatacli: {
labels: [
'SourceClear ',
'Hawkeye',
'Sonarqube ',
' Glair ',
'Coverity '

          ],
          datasets: [{
              data: [
                10,
                20,
                30,
                40,
                50

                ],
              backgroundColor: [
              '#36A2EB',
              '#FFCE56',
              '#FF851B',
              '#7FDBFF',
              '#FF0000'
              ],
              hoverBackgroundColor: [
              '#36A2EB',
              '#FFCE56',
              '#FF851B',
              '#7FDBFF',
              '#FF0000'
              ]
          }]
          },

CLI Tools Usage

{toolDatacli && }

when i start the application i am getting error like
TypeError: Cannot read property 'defaults' of undefined
(anonymous function)
D:/GoLang/GoProject/src/git02.ae.sda.corp.telstra.com/pip/svc-dashboard-web/node_modules/react-chartjs-2/es/index.js:643
640 | }(_react["default"].Component);
641 |
642 | exports.Scatter = Scatter;

643 | var defaults = _chart["default"].defaults;
644 | exports.defaults = defaults;
View compiled
./node_modules/react-chartjs-2/es/index.js
http://localhost:3000/static/js/0.chunk.js:30275:30
__webpack_require__
D:/GoLang/GoProject/src/git02.ae.sda.corp.telstra.com/pip/svc-dashboard-web/webpack/bootstrap:851
848 |
849 | __webpack_require__.$Refresh$.init();
850 | try {
851 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
| ^ 852 | } finally {
853 | __webpack_require__.$Refresh$.cleanup(moduleId);
854 | }

[robertjwozniak]

@Harsha3878 Did you find a solution to this problem? I'm having this issue as well

[robertjwozniak]

I'm actually having this issue:
TypeError: _chart.default is undefined

[isailaoctavian]

@Harsha3878 I have exactly the same issue like you.. Did you find a solution?

[isailaoctavian]

@robertjwozniak Please tag me if you find a solution

[insivika]

Same issue here

[douglasjauhar]

Fucking issue just noww

[douglasjauhar]

2 months ago I developed a project there were no issues at all, but now suddenly there are issues that are annoying, anyone who can help to provide information

[zeyker]

I was having the same issue, i fixed it going back to version "chart.js": "^2.9.4" and keeping "react-chartjs-2": "^2.11.1"
@isailaoctavian

[himanshu76200]

I was having the same issue, i fixed it going back to version "chart.js": "^2.9.4" and keeping "react-chartjs-2": "^2.11.1"
@isailaoctavian

Yes I believe there is some problem with the latest version of chart.js.
BTW thanks a lot for ur Comment

[aaaaayushh]

I'm actually having this issue:
TypeError: _chart.default is undefined

same issue for me
@zeyker tried installing the older version of chart.js but still the same problem

[orisailes]

got the same issue.
solve it by change the "chart.js": "^2.9.4", in your package.json
then delete node modules folder, then in terminal run npm install .

[levankhoabhc]

got the same issue.
solve it by change the "chart.js": "^2.9.4", in your package.json
then delete node modules folder, then in terminal run npm install .

This works for me, thanks.

[insivika]

Also fixed it for me, thank you!

[ArianNexux]

solve it by change the "chart.js": "^2.9.4", in your package.json

Solved, Thanks.

[isailaoctavian]

@orisailes thanks a lot, you save the day! God bless you

[devidb00]

Thank you very much for the help !

[AnwarHossainSR]

Thank you so much. the problem is solved for me

[gozel-cholukova]

Thanks a Lot... very helpful

[Kbllo]

Thanks

got the same issue.
solve it by change the "chart.js": "^2.9.4", in your package.json
then delete node modules folder, then in terminal run npm install .

This works for me, thanks.

[lokeshgaria]

Thanks

got the same issue.
solve it by change the "chart.js": "^2.9.4", in your package.json
then delete node modules folder, then in terminal run npm install .

This works for me, thanks.

hey im just getting same error but i did rewrite the version but still geting the error pls help

[po4tion]

Thanks!!
I solved this problem. Removed latest version "chart.js" and added chart.[email protected]

[savindug]

thanks

[Byte-Box]

got the same issue.
solve it by change the "chart.js": "^2.9.4", in your package.json
then delete node modules folder, then in terminal run npm install .

This worked like a charm, thanks so much

[adedking]

got the same issue.
solve it by change the "chart.js": "^2.9.4", in your package.json
then delete node modules folder, then in terminal run npm install .

Was having the same issue. This worked for me. Thanks a lot

[nimrod-cohen]

Why is this issue closed, its definitely not resolved, and all the people here saying "solved" when all they did was downgraded to previous version.
The issue remains since v.3.02 - please reopen this issue.

[arjun-myanger]

got the same issue.
solve it by change the "chart.js": "^2.9.4", in your package.json
then delete node modules folder, then in terminal run npm install .

Thanks man!

[JavascriptDeNoobAPro]

Mee too ! I just downgraded chart.js to ^2.9.4, and it worked, - but the issue is not solved.
Please reopen this issue.
cheers!

[walidilyas]

solve it by change the "chart.js": "^2.9.4"

[developer-junaid]

I was having the same issue, i fixed it going back to version "chart.js": "^2.9.4" and keeping "react-chartjs-2": "^2.11.1"
@isailaoctavian

It worked, love you man !

[Yansb]

@orisailes Worked, thanks

[duttanaman1]

I am facing the same issue even with "chart.js": "^2.9.4", and "react-chartjs-2": "^2.11.1", Cannot read property 'defaults' of undefined