search

plouc / nivo

nivo provides a rich set of dataviz components, built on top of the awesome d3 and React libraries
https://nivo.rocks
MIT License
13.08k stars 1.02k forks source link

TypeError: Cannot read property 'showTooltipFromEvent' of undefined (@nivo-geo.esm.js:633) #644

Closed tg970 closed 5 years ago

tg970 commented 5 years ago

Updated to the most recent versions of the packages today and now getting this error while using (render) the Responsive Choropleth:

nivo-geo.esm.js:633 Uncaught TypeError: Cannot read property 'showTooltipFromEvent' of undefined at nivo-geo.esm.js:633 at renderWithHooks (react-dom.development.js:12938) at mountIndeterminateComponent (react-dom.development.js:15020) at beginWork (react-dom.development.js:15625) at performUnitOfWork (react-dom.development.js:19312) at workLoop (react-dom.development.js:19352) at HTMLUnknownElement.callCallback (react-dom.development.js:149) at Object.invokeGuardedCallbackDev (react-dom.development.js:199) at invokeGuardedCallback (react-dom.development.js:256) at replayUnitOfWork (react-dom.development.js:18578)

In looking at the Tooltip package there might be something wrong with the exported 'useTooltip' function and the context it uses, which might be empty ('tooltipContext'). Still pretty new to hooks so will have to do some more research on how this might need to look.

Any help would be appreciated!

Thanks, Tyler

tg970 commented 5 years ago

Issue resolved itself - not quite sure how or why.

BannukDE commented 5 years ago

Really no clue what could have resolved it? Having almost the same err msg with ResponsiveBarChart. For me it is 'tooltip' of undefined (theme.tooltip.basic)

tg970 commented 5 years ago

I know, wish I could put my finger on it but can't. I went ahead and updated all of my dependencies during this time for Webpack, npm (6.10.1), and Node (12.6.0) and so thinking that must have been it.

What versions are you running?

mackattack3k commented 4 years ago

Really no clue what could have resolved it? Having almost the same err msg with ResponsiveBarChart. For me it is 'tooltip' of undefined (theme.tooltip.basic)

I'm having this issue but with ResponsivePie. Did you solve it?

Ajaay commented 4 years ago

I'm having this issue with Radar as well. Anyone else managed to resolve it? Worked fine on an older version but updating the newest gives me this error.

mackattack3k commented 4 years ago

Did not manage to resolve it. I had to abandon nivo unfortunately.

Michaelzvu commented 4 years ago

Same thing with @nivo/bump

Cannot read property 'showTooltipFromEvent' of undefined TypeError: Cannot read property 'showTooltipFromEvent' of undefined at useSerieHandlers (http://localhost:9009/vendors~main.5bcb906ecc7a7699ea95.bundle.js:15643:42) at Area (http://localhost:9009/vendors~main.5bcb906ecc7a7699ea95.bundle.js:15823:18) at renderWithHooks (http://localhost:9009/vendors~main.5bcb906ecc7a7699ea95.bundle.js:198915:18) at updateFunctionComponent (http://localhost:9009/vendors~main.5bcb906ecc7a7699ea95.bundle.js:201002:20) at updateSimpleMemoComponent (http://localhost:9009/vendors~main.5bcb906ecc7a7699ea95.bundle.js:200940:10) at updateMemoComponent (http://localhost:9009/vendors~main.5bcb906ecc7a7699ea95.bundle.js:200843:14) at beginWork$1 (http://localhost:9009/vendors~main.5bcb906ecc7a7699ea95.bundle.js:202903:16) at HTMLUnknownElement.callCallback (http://localhost:9009/vendors~main.5bcb906ecc7a7699ea95.bundle.js:182991:14) at Object.invokeGuardedCallbackDev (http://localhost:9009/vendors~main.5bcb906ecc7a7699ea95.bundle.js:183040:16) at invokeGuardedCallback (http://localhost:9009/vendors~main.5bcb906ecc7a7699ea95.bundle.js:183095:31)

wyze commented 4 years ago

@Michaelzvu Make sure all nivo charts are at the same version. If they mismatch and depend on different versions it usually causes these types of errors.

Michaelzvu commented 4 years ago

@wyze I did uninstall for all nivo packages and installed only: "@nivo/axes": "^0.62.0", (Im getting an error without it) "@nivo/bump": "0.62.0", And still I have the same error: "Cannot read property 'showTooltipFromEvent' of undefined"

plouc commented 4 years ago

@Michaelzvu, there's a cyclic dependency between @nivo/core and @nivo/tooltip which could be the issue (especially with yarn 2 apparently), are you using yarn/npm? It might be useful if you could share the installed versions you got (npm list | grep '@nivo' or yarn list | grep '@nivo').

Michaelzvu commented 4 years ago

@plouc Im using npm

npm list | grep '@nivo' npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: angular@>=1.3 <1.6, required by angular-material@1.1.0 npm ERR! peer dep missing: angular@~1.3.17, required by angular-ui-bootstrap@0.13.0 npm ERR! peer dep missing: angular-animate@>=1.3 <1.6, required by angular-material@1.1.0 npm ERR! peer dep missing: angular-aria@>=1.3 <1.6, required by angular-material@1.1.0 npm ERR! peer dep missing: bootstrap@3.1, required by angular-ui-bootstrap@0.13.0 npm ERR! peer dep missing: angular@>=1.3 <1.6, required by angular-material@1.1.0 npm ERR! peer dep missing: angular@~1.3.17, required by angular-ui-bootstrap@0.13.0 npm ERR! peer dep missing: angular-animate@>=1.3 <1.6, required by angular-material@1.1.0 npm ERR! peer dep missing: angular@>=1.3 <1.6, required by angular-material@1.1.0 npm ERR! peer dep missing: angular@~1.3.17, required by angular-ui-bootstrap@0.13.0 npm ERR! peer dep missing: acorn@^6.0.0, required by acorn-dynamic-import@4.0.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: angular@>=1.3 <1.6, required by angular-material@1.1.0 npm ERR! peer dep missing: angular@~1.3.17, required by angular-ui-bootstrap@0.13.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: ajv@^6.9.1, required by ajv-keywords@3.5.0 npm ERR! peer dep missing: angular@>=1.3 <1.6, required by angular-material@1.1.0 npm ERR! peer dep missing: angular@~1.3.17, required by angular-ui-bootstrap@0.13.0 npm ERR! peer dep missing: angular@>=1.3 <1.6, required by angular-material@1.1.0 npm ERR! peer dep missing: angular@~1.3.17, required by angular-ui-bootstrap@0.13.0 ├─┬ @nivo/axes@0.62.0 │ ├─┬ @nivo/core@0.62.0 │ │ ├── @nivo/tooltip@0.62.0 deduped │ ├─┬ @nivo/scales@0.62.0 ├─┬ @nivo/bump@0.62.0 │ ├─┬ @nivo/colors@0.62.0 │ ├── @nivo/core@0.62.0 deduped │ ├─┬ @nivo/legends@0.62.0 │ │ ├── @nivo/core@0.62.0 deduped │ ├─┬ @nivo/tooltip@0.62.0 │ │ ├── @nivo/core@0.62.0 deduped

Michaelzvu commented 4 years ago

Problem solved! Just did 'rm -rf node_modules package-lock.json' Probably I had some issue with the package-lock.json file.

Thank you!

amihalopoulos commented 4 years ago

Stopping to confirm I had the same issue as @Michaelzvu and also fixed by deleting node_modules & package-lock .. all @nivo packages seemed to be @0.62.0 yet hovering/tooltip broke my app on multiple charts. Not sure what exactly caused the mixup but problem solved I guess

vinz243 commented 2 years ago

I was running into a somewhat similar issue : tooltips on the chord chart where not showing. Again, same issue with different versions of @nivo/tooltip installed.

Removing node_modules AND package-lock fixed the issue thanks for the thread!

Anyway I think something about that should be addressed in the docs, because I did had to spend a lot of time debugging to realize that there were to nivo/tooltip modules...