TypeError: undefined is not a function (near '...', click).transition().duration(750).att...')
See original GitHub issueI used PieChart in a component. It works when it first rendered. But I got this error after any state update: TypeError: undefined is not a function (near ‘…’, click).transition().duration(750).att…') logCapturedError — react-dom.development.js:16477
This is how I used the PieChart:
<PieChart
size={CHART_SIZE}
data={[
{ key: 'A', value: 100, color: CHART_RED },
{ key: 'B', value: 200, color: CHART_ORANGE },
{ key: 'C', value: 50, color: CHART_YELLOW },
{ key: 'D', value: 50, color: CHART_GREEN },
{ key: 'E', value: 50, color: CHART_BLUE },
]}/>
It works when I forked from the repo and comment out the some lines of codes (transition) like this:
if (n) { // we don't need to do this, but it's fun
/*
* Change current slices
* Transition current slice dimensions
*/
path
.attr('fill', getSliceFill)
.on('mouseover', mouseover)
.on('mouseout', mouseout)
.on('mousemove', mousemove)
.on('click', click)
// .transition()
// .duration(750)
// .attrTween('d', this.tweenSlice);
/*
* Add new slices
*/
path
.enter()
.append('path')
.attr('class', 'pie-chart-slice')
.attr('fill', getSliceFill)
.on('mouseover', mouseover)
.on('mouseout', mouseout)
.on('mousemove', mousemove)
.on('click', click)
.each((d, i) => currentSlices.splice(i, 1, d))
// .transition()
// .duration(750)
// .attrTween('d', this.tweenSlice);
}
Versions: react-easy-chart: 1.0.0 react: ^16.6.0 react-dom: ^16.6.0
Issue Analytics
- State:
- Created 5 years ago
- Comments:8
Top Results From Across the Web
d3.js - How to resolve "Uncaught TypeError: undefined is not a ...
How to resolve "Uncaught TypeError: undefined is not a function" in ... It works fine on this JS Fiddle, however when I try...
Read more >Bountysource
TypeError : undefined is not a function (near '...', click).transition().duration(750).att...')
Read more >D3 Transitions | D3 in Depth
This article shows how to add transitions to selection updates, how to set transition duration, how to create staggered transitions, how to change...
Read more >https://www.att.com/es-us/device-support/selector/...
getElementsByTagName(k)}function L(k){var w=k.length;if("number"===typeof w)k=w ... k.length)return M(new TypeError(typeof k+" "+k+" is not iterable(cannot ...
Read more >d3-transition - npm
Returns a new transition on the given selection with the specified name. If a name is not specified, null is used. The new...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Thanks a lot. It works.
My 2 cents: You have to restart the app to reflect node_modules changes. I had to do that.
Ok, this is a massive blocker to using
react-easy-chart
. Editingnode_modules
is not a valid solution. Is clearly a bug with the module, and needs fixing at source 😦