react-chartjs-2: Defaults creating error

I’m trying to use the { defaults } provided by your wrapper but when I pass these into a <Bar /> 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

About this issue

Original URL
State: closed
Created 8 years ago
Comments: 40

Commits related to this issue

Update node modules Some modules were outdated or have some vulnerabilities. Also fixing errors spotted with new eslint by using command: npx eslint --fix web/src/ The chart.js was set to 2.9.4 a... — committed to danpawlik/monocle by danpawlik 3 years ago

Most upvoted comments

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 .

+77

orisailes on Apr 4, 2021

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

+40

zeyker on Apr 3, 2021

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 && <Doughnut data={toolDatacli} /> } </div>

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 | }

+14

Harsha3878 on Sep 24, 2020

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

duttanaman1 on Apr 20, 2021

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 !

developer-junaid on Apr 18, 2021

solve it by change the “chart.js”: “^2.9.4”

walidilyas on Apr 16, 2021

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!

JavascriptDeNoobAPro on Apr 16, 2021

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!

arjun-myanger on Apr 15, 2021

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

aaaaayushh on Apr 4, 2021