question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

TypeError: undefined is not a function (near '...', click).transition().duration(750).att...')

See original GitHub issue

I 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

image

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:open
  • Created 5 years ago
  • Comments:8

github_iconTop GitHub Comments

1reaction
dharnniecommented, Mar 11, 2019

Thanks a lot. It works.

My 2 cents: You have to restart the app to reflect node_modules changes. I had to do that.

0reactions
jhchill666commented, Apr 20, 2019

Ok, this is a massive blocker to using react-easy-chart. Editing node_modules is not a valid solution. Is clearly a bug with the module, and needs fixing at source 😦

Read more comments on GitHub >

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

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found